jsp+ajax 无刷新更新页面数据? ？实例？
日期：2014-05-20 浏览次数：20691 次
jsp+ajax 无刷新更新页面数据?? 求助？实例？？
jsp+ajax 无刷新更新页面数据?? 有没有demo？
------解决方案--------------------
是这意思不？
js:
<script type="text/javascript">
function change(){
var req = new XMLHttpRequest();
req.open("get","<%=request.getContextPath()%>/servlet/MyServlet",true);
req.onreadystatechange = function(){
if(req.readyState == 4 && req.status == 200){
var obj = window.eval("("+req.responseText+")");
var tbl = document.getElementById("mytable");
//for(var i=0;i<=tbl.rows.length;i++){
//tbl.deleteRow(1);
//}
for(var i=0;i<obj.length;i++){
//var tr1 = tbl.insertRow();
//var td1 = tr1.insertCell() ;//添加一个单元格（一列）
//td1.innerHTML=obj[i].id ; //标题显示内容
//var td2 = tr1.insertCell() ; //添加一个单元格（一列）
//td2.innerHTML=obj[i].name ; //标题显示内容
tbl.rows[i+1].cells[0].innerHTML=obj[i].id;
tbl.rows[i+1].cells[1].innerHTML=obj[i].name;
}
}
};
req.send(null);
setTimeout("change()",1000);
}
</script>
jsp:
<body onload="change()">
<table id="mytable" border=1>
<tr>
<th>编号</th>
<th>姓名</th>
</tr>
<tr>
<td>1</td>
<td>啊啊</td>
</tr>
<tr>
<td>2</td>
<td>版本</td>
</tr>
<tr>
<td>3</td>
<td>常常</td>
</tr>
</table>
</body>
servlet:
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
response.setCharacterEncoding("UTF-8");
response.setHeader("Cache-Control", "no-store");
PrintWriter out = response.getWriter();
int id1 = new Random().nextInt(100);
int id2 = new Random().nextInt(100);
int id3 = new Random().nextInt(100);
int name1 = new Random().nextInt(7);
int name2 = new Random().nextInt(7);
int name3 = new Random().nextInt(7);
String[] names={"反对","热","饭店","前期","版本","谔谔","很好","看看"};
out.println("[{'id':"+id1+",'name':'"+names[name1]+"'},{'id':"+id2+",'name':'"+names[name2]+"'},{'id':"+id3+",'name':'"+names[name3]+"'}]");
out.flush();
out.close();
}
------解决方案--------------------
去看看联动下拉列表的例子。。
------解决方案--------------------
it is so simple
------解决方案--------------------
查点jquery资料。如果掌握了jquery，相信的你问题也会迎刃而解
------解决方案--------------------
可能是缓存的问题，在你的url后面加随机数如
url:"/xxx/xx.jsp?t=" + (new Date()).valueOf()
jsp+ajax 无刷新更新页面数据?? 有没有demo？
------解决方案--------------------
是这意思不？
js:
<script type="text/javascript">
function change(){
var req = new XMLHttpRequest();
req.open("get","<%=request.getContextPath()%>/servlet/MyServlet",true);
req.onreadystatechange = function(){
if(req.readyState == 4 && req.status == 200){
var obj = window.eval("("+req.responseText+")");
var tbl = document.getElementById("mytable");
//for(var i=0;i<=tbl.rows.length;i++){
//tbl.deleteRow(1);
//}
for(var i=0;i<obj.length;i++){
//var tr1 = tbl.insertRow();
//var td1 = tr1.insertCell() ;//添加一个单元格（一列）
//td1.innerHTML=obj[i].id ; //标题显示内容
//var td2 = tr1.insertCell() ; //添加一个单元格（一列）
//td2.innerHTML=obj[i].name ; //标题显示内容
tbl.rows[i+1].cells[0].innerHTML=obj[i].id;
tbl.rows[i+1].cells[1].innerHTML=obj[i].name;
}
}
};
req.send(null);
setTimeout("change()",1000);
}
</script>
jsp:
<body onload="change()">
<table id="mytable" border=1>
<tr>
<th>编号</th>
<th>姓名</th>
</tr>
<tr>
<td>1</td>
<td>啊啊</td>
</tr>
<tr>
<td>2</td>
<td>版本</td>
</tr>
<tr>
<td>3</td>
<td>常常</td>
</tr>
</table>
</body>
servlet:
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
response.setCharacterEncoding("UTF-8");
response.setHeader("Cache-Control", "no-store");
PrintWriter out = response.getWriter();
int id1 = new Random().nextInt(100);
int id2 = new Random().nextInt(100);
int id3 = new Random().nextInt(100);
int name1 = new Random().nextInt(7);
int name2 = new Random().nextInt(7);
int name3 = new Random().nextInt(7);
String[] names={"反对","热","饭店","前期","版本","谔谔","很好","看看"};
out.println("[{'id':"+id1+",'name':'"+names[name1]+"'},{'id':"+id2+",'name':'"+names[name2]+"'},{'id':"+id3+",'name':'"+names[name3]+"'}]");
out.flush();
out.close();
}
------解决方案--------------------
去看看联动下拉列表的例子。。
------解决方案--------------------
it is so simple
------解决方案--------------------
查点jquery资料。如果掌握了jquery，相信的你问题也会迎刃而解
------解决方案--------------------
可能是缓存的问题，在你的url后面加随机数如
url:"/xxx/xx.jsp?t=" + (new Date()).valueOf()
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
