问题描述
- Java入门新人求解答:如何能保存修改后的网页?求代码
-
<%@ page import ="java.util.*" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Welcome to TV_Play's Web
// 新增
function trdadd(){
flag=false;
document.getElementById("fid").style.display="block"; //控制显示
chongzhi();
document.getElementById("aid").disabled=false; //重新启用}
//保存
function baocun(){
if(flag==false){add(flag);
document.getElementById("fid").style.display="none";
}else{add(flag);
document.getElementById("fid").style.display="none";}
}//重置
function chongzhi(){
document.getElementById("formid").reset();
}//删除
function deleteRow(input){
var s=input.parentNode.parentNode.rowIndex;
document.getElementById("tableid").deleteRow(s);
var num=document.getElementById("tableid").rows.length;
for(var i=1;i<num;i+=1){
table.rows[i].cells[0].innerHTML=i; //把每行的每一列设为i}
alert("Delete Successfully !!"); //删除成功
}id name language country_of_origin genre operation <br> <br> <br> <div id="fid" style="display : none"> <form id="formid"> <table id=aaid> <tr> <td colspan="6">name : <input id="aid" type="text" size="20%"> </td> <td colspan="6">language : <input id="bid" type="text" size="20%"> </td> </tr> <tr> <td colspan="6">country_of_origin : <input id="cid" type="text" size="20%"></td> <td>genre : <select id="eid" name="my_name"> <option value="1">Horror</option> <option value="2">Sitcom</option> <option value="3">Fantasy</option> <option value="4">Science Fantasy</option> <option value="5">Crime Drama</option> <option value="6">Period Drama</option> <option value="7">Family</option> </select> </td> </tr> </table> <input type="button" value="save" onclick="baocun()"> <input type="reset" value="reset" onclick="chongzhi()"> <!-- 重置type类型必须为reset--> <!-- 重置 --> </form> </div> </center> <script type="text/javascript"> //全局变量 var table=document.getElementById("tableid"); var flag=false; var getselectrow; function getNum(){ var haoRow=table.rows[0]; return haoRow.cells.length; } //添加方法 function add(flag){ if(!flag){ // var num=getNum(); var row=table.insertRow(-1); //为-1时往下加(升序),为0时往上加(id降序) var add1=row.insertCell(0); var add2=row.insertCell(1); var add3=row.insertCell(2); var add4=row.insertCell(3); var add5=row.insertCell(4); var add6=row.insertCell(5); add1.innerHTML=document.getElementById("tableid").rows.length-1;//不加-1时id从二开始;原因:标题占一个 add2.innerHTML=document.getElementById("aid").value; add3.innerHTML=document.getElementById("bid").value; add4.innerHTML=document.getElementById("cid").value; var tall=document.getElementById("eid"); var index=tall.selectedIndex;// 当前坐标 var option=tall.options[index]; add5.innerHTML=option.text; add6.innerHTML="<input type='button' value='revise' onclick='updateRow(this)'> <input type='button' value='delete' onclick='deleteRow(this)'>"; //alert(num); alert("Add Successfully!!"); //添加成功 }else{ var row2=table.rows[getselectrow];//选中当前行 //把修改后的值设置到对应的文本框中 row2.cells[1].innerHTML=document.getElementById("aid").value; row2.cells[2].innerHTML=document.getElementById("bid").value; row2.cells[3].innerHTML=document.getElementById("cid").value; var pall=document.getElementById("eid"); var index=pall.selectedIndex; //当前坐标 var option=pall.options[index]; row2.cells[4].innerHTML=option.text; alert("Revise Successfully!!"); //修改成功 } } //修改 function updateRow(input){ flag=true document.getElementById("aid").disabled=true; //不能启用 document.getElementById("fid").style.display="block"; var i=input.parentNode.parentNode.rowIndex; getselectrow=i; //得到选中行的内容放到文本框 document.getElementById("aid").value=table.rows[i].cells[1].innerHTML; document.getElementById("bid").value=table.rows[i].cells[2].innerHTML; document.getElementById("cid").value=table.rows[i].cells[3].innerHTML; var select=document.getElementById("eid"); var index=select.selectedIndex;// 当前坐标 var option= select.options[index]; option.text=table.rows[i].cells[4].innerHTML; } </script>
以上是我的代码,请问还有写什么代码才能让这个网站具有修改后保存的功能?
举个例子:
我添加一个id为1,name为Doctor Who,language为English,country_of_origin,
genre为Sicence_Fantasy的列,请问添加后如何让它永久保留在网页上,而不是下次刷新后就消失了?
求代码,谢谢。
解决方案
简单的操作建议就用 jsp+servlet+javabean
jsp位于视图层,就是展示从后台传来的东西.
分工要明细,不能要求它既能展示东西,又要保存数据,又能处理业务,
建议楼主去看看mvc.
如果要添加之后刷新留在页面那就在servlet获取jsp的添加的值,之后通过javabean的set保存.最后传到jsp
解决方案二:
你不能光用一个jsp页面写点js代码就能保存数据的简单可以用jsp servlet javabean mysql。比较复杂可以使用三大框架的struts+spring+hibernate或者其他构架也可以,构架Struts2做的MVC的流程框架,主要完成从客户端访问到选择anction的过程,其中过滤器起到了Controller的作用,action属于model,而jsp则是view页面的展示。Spring主要利用Ioc的特长来管理各种对象:action,service,dao,数据访问源,Hibernate的核心对象SessionFactory等,还有就是声明式事务的管理等。hibernate管理数据库开发mysql就够了,
解决方案三:
你不能光用一个jsp页面写点js代码就能保存数据的简单可以用jsp servlet javabean mysql。比较复杂可以使用三大框架的struts+spring+hibernate或者其他构架也可以,构架Struts2做的MVC的流程框架,主要完成从客户端访问到选择anction的过程,其中过滤器起到了Controller的作用,action属于model,而jsp则是view页面的展示。Spring主要利用Ioc的特长来管理各种对象:action,service,dao,数据访问源,Hibernate的核心对象SessionFactory等,还有就是声明式事务的管理等。hibernate管理数据库开发mysql就够了,
解决方案四:
如果只是一些简单的,数据量不大的可以放在cookie里
解决方案五:
简单点就是用持久化的技术。