87,994
社区成员
发帖
与我相关
我的任务
分享用ajax，数据在ie5,ie7可以显示，但在360，谷歌，火狐显示不了，求帮助！！已困扰3天！！
ie浏览器的结果：
360浏览器给的提示,界面无法显示
这是我的js文件，名为request.js代码如下：
function httpRequest(reqType,url,async,resFun,parameter){
var request=null;
if(window.ActiveXObject){
request=new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
request=new XMLHttpRequest();
}
if( request || typeof( request ) == "object" ){
if(reqType.toLowerCase()=="post"){ //以POST方式提交
request.open(reqType, url, true); //打开服务器连接
//设置MIME类型
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
request.onreadystatechange = resFun;//设置处理响应的回调函数
parameter = encodeURI(parameter); //将参数字符串进行编码
request.send(parameter); //发送请求
}
else{ //以GET方式提交
url = url+"?"+parameter; //重新设置URL，GET方式需要在URL中附带请求参数
request.open(reqType, url, true); //打开服务器连接
request.onreadystatechange = resFun;//响应回调函数
request.send(null); //发送请求
}
}
else{
alert( "该浏览器不支持Ajax！" );
}
return request;
}
这是我的界面：index.jsp，代码如下：
<%@page contentType="text/html" import="com.core.*,com.model.CommodityForm,java.util.*"
pageEncoding="GBK"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>Ajax无刷新分页</title>
<script language="javascript" src="js/request.js"></script>
<script language="javascript">
var request = null; //保存 XMLHttpRequest对象的全局变量
//Ajax请求方法
function getData(page){
var url="GoodsServlet"; //服务器地址
var param ="page="+page+"&order=0&nocache="+new Date().getTime(); //请求参数
request=httpRequest("post",url,true,callbackFunc,param); //调用请求方法
}
//Ajax回调函数
function callbackFunc(){
if(request.readyState == 4){
if(request.status == 200){
var doc = request.responseXML;
var pageNum = doc.getElementsByTagName("pageNum")[0].firstChild.data;
var maxPage= doc.getElementsByTagName("maxPage")[0].firstChild.data;
var prePage = doc.getElementsByTagName("prePage")[0].firstChild.data;
var nextPage = doc.getElementsByTagName("nextPage")[0].firstChild.data;
var goodses = doc.getElementsByTagName("goods");
var innerHTML = "";
if((goodses!=null)&&(goodses.length!=0)) {
innerHTML+="<table width='96%' border='1' cellpadding='0' cellspacing='0' bordercolor='#FFFFFF' bordercolordark='#FFFFFF' bordercolorlight='CFCFCF'>";
innerHTML+="<tr align='center' height='30'>";
innerHTML+="<td><a href =\"javascript: orderById("+(parseInt(prePage)+1)+")\">商品编号</a></td>";
innerHTML+="<td>商品名称</td>";
innerHTML+="<td>简介</td>";
innerHTML+="<td>单价</td></tr>";
for(var i=0;i<goodses.length;i++) {
var goods = goodses[i];
var goodsId = goods.childNodes[0].firstChild.data;
var goodsName = goods.childNodes[1].firstChild.data;
var introduce = goods.childNodes[2].firstChild.data;
var price = goods.childNodes[3].firstChild.data;
innerHTML += "<tr height='30'>";
innerHTML += "<td align='left'> "+goodsId+"</td>";
innerHTML += "<td align='left'> "+goodsName+"</td>";
innerHTML += "<td align='left'> "+introduce+"</td>";
innerHTML += "<td align='left'> "+price+"</td>";
innerHTML += "</tr>";
}
innerHTML+="<tr height='30'><td align='center' colspan='7'>";
innerHTML +="["+ pageNum+"/"+maxPage+"] ";
innerHTML += "<a href='javascript:void(0)' onClick=\"getData(1)\">[首 页]</a> ";
innerHTML += "<a href='javascript:void(0)' onClick=\"getData("+prePage+")\">[上一页]</a> ";
innerHTML += "<a href='javascript:void(0)' onClick=\"getData("+nextPage+")\">[下一页]</a> ";
innerHTML +="<a href='javascript:void(0)' onClick=\"getData("+maxPage+")\">[尾页]</a>";
innerHTML+="</td></tr>\n";
innerHTML+="</table>\n";
}else {
innerHTML += "暂时没有任何数据";
}
document.getElementById("goodsList").innerHTML = innerHTML;
request = false;//此处必须设置XMLHttpRequest对象的变量为初始状态
}
}
}
function orderById(page){
var flag = document.getElementById("flag").value;
alert(page);
var url="GoodsServlet"; //服务器地址
var param ="page="+page+"&order="+flag+"&nocache="+new Date().getTime(); //请求参数
request=httpRequest("post",url,true,callbackFunc,param); //调用请求方法
if(flag=="0"){
document.getElementById("flag").value="1";
return;
}
else if(flag=="1"){
document.getElementById("flag").value="0";
return;
}
}
window.onload=function(){
getData(1);
}
</script>
</head>
<body>
<input type="hidden" name="flag" id="flag" value="0"/>
<table width="788" height="236" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="199" height="182" valign="top" bgcolor="#FFFFFF"></td>
<td valign="top" bgcolor="#FFFFFF"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="45" valign="top" > </td>
</tr>
<tr>
<td height="10" valign="top"> </td>
</tr>
<tr>
<td height="94" valign="top" align="center">
<span id="goodsList"></span>
</td>
</tr>
</table></td>
</tr>
</table>
</table>
</body>
</html>
这是我的servlet，主要代码如下：
public class GoodsServlet extends HttpServlet {
private Document doc;
private int pagesize=4;
/**
* Destruction of the servlet. <br>
*/
public void destroy() {
super.destroy(); // Just puts "destroy" string in log
// Put your code here
}
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("UTF-8");
response.setContentType( "text/xml;charset=UTF-8" );//设置响应格式为test/xml
//禁止缓存
response.addHeader( "Cache-Control", "no-store,no-cache,must-revalidate" );
response.addHeader( "Cache-Control", "post-check=0,pre-check=0" );
response.addHeader( "Expires", "0" );
response.addHeader( "Pragma", "no-cache" );
PrintWriter out = response.getWriter();
PageElement pageArgs = getPageArgs(); // 获取数据分页参数
List goodses = null; // 创建数据集合
// 获取请求对象的分页参数
int page=1;
if(null!=request.getParameter("page")){
page = Integer.parseInt(request.getParameter("page"));
}
String order = request.getParameter("order");
pageArgs.setPageCount(page);
out.println( "<?xml version=\"1.0\" encoding=\"utf-8\"?>" );
out.println( "<goodses>" );
out.println( "<pageElement>" );
out.println( "<pageNum>" +pageArgs.getPageNum()+"</pageNum>");
out.println( "<maxPage>" +pageArgs.getMaxPage()+"</maxPage>");
out.println( "<nextPage>" +pageArgs.getNextPage()+"</nextPage>");
out.println( "<prePage>" +pageArgs.getPrePage()+"</prePage>");
out.println( "</pageElement>" );
try{
goodses = getGoods(page,order);
}catch(Exception e){
e.printStackTrace();
}
for(int i=0;i<goodses.size();i++){
CommodityForm commodity = (CommodityForm) goodses.get(i);
out.println( "<goods>" );
out.println( "<id>"+commodity.getId()+"</id>" );
out.println( "<goodsName>"+commodity.getName()+"</goodsName>" );
out.println( "<introduce>"+commodity.getIntroduce()+"</introduce>" );
out.println( "<Price>"+commodity.getPrice()+"</Price>" );
out.println( "</goods>" );
}
out.println( "</goodses>" );
out.close();
}
public List getGoods(final int page,String order) throws Exception {
List list = new ArrayList(); // 创建保存分页数据的集合对象
ConnDB conn = new ConnDB(); // 连接数据库
CommodityForm f =null;
int firstResult = (page-1) * pagesize;
try {
// 定义分页查询的SQL语句
String sql="";
if(order.equals("0")){
sql = "select * from tb_goods order by id asc limit "+firstResult+","+pagesize;
}
else if(order.equals("1")){
sql = "select * from tb_goods order by id desc limit "+firstResult+","+pagesize;
}
ResultSet rs = conn.executeQuery(sql); // 获取查询结果
while (rs.next()) { // 遍历查询结果集
f = new CommodityForm(); // 创建分页对象
f.setId(rs.getInt("id"));
f.setName(rs.getString("name"));
f.setIntroduce(rs.getString("introduce"));
f.setPrice(rs.getFloat("price"));
list.add(f); // 添加分页数据对象到List集合
}
} catch (SQLException ex) {
ex.printStackTrace();
} finally {
conn.close();
}
return list;
}
public PageElement getPageArgs() {
PageElement pag = null; // 声明分页参数对象
Statement stmt = null;
ResultSet rs = null;
ConnDB conn = new ConnDB(); // 连接数据库
try {
// 声明查询总数据量的SQL语句
String sql = "SELECT count(*) FROM tb_goods";
rs = conn.executeQuery(sql); // 执行SQL查询
if (rs.next()) {
int count = rs.getInt(1); // 获取查询结果
pag = new PageElement(); // 初始化分页参数对象
pag.setPageSize(pagesize); // 设置分页大小
pag.setMaxPage((count + pagesize - 1) / pagesize);// 设置最大页码
pag.setPageCount(count); // 设置当前页码
}
} catch (SQLException ex) {
ex.getMessage();
} finally {
conn.close();
}
return pag;
}
public void init() throws ServletException {
// Put your code here
}
}
数据库连接，dao类什么的应该没问题，感觉是dom对象的节点处理出了兼容性问题
360浏览器给的提示,界面无法显示
这是我的js文件，名为request.js代码如下：
function httpRequest(reqType,url,async,resFun,parameter){
var request=null;
if(window.ActiveXObject){
request=new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
request=new XMLHttpRequest();
}
if( request || typeof( request ) == "object" ){
if(reqType.toLowerCase()=="post"){ //以POST方式提交
request.open(reqType, url, true); //打开服务器连接
//设置MIME类型
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
request.onreadystatechange = resFun;//设置处理响应的回调函数
parameter = encodeURI(parameter); //将参数字符串进行编码
request.send(parameter); //发送请求
}
else{ //以GET方式提交
url = url+"?"+parameter; //重新设置URL，GET方式需要在URL中附带请求参数
request.open(reqType, url, true); //打开服务器连接
request.onreadystatechange = resFun;//响应回调函数
request.send(null); //发送请求
}
}
else{
alert( "该浏览器不支持Ajax！" );
}
return request;
}
这是我的界面：index.jsp，代码如下：
<%@page contentType="text/html" import="com.core.*,com.model.CommodityForm,java.util.*"
pageEncoding="GBK"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>Ajax无刷新分页</title>
<script language="javascript" src="js/request.js"></script>
<script language="javascript">
var request = null; //保存 XMLHttpRequest对象的全局变量
//Ajax请求方法
function getData(page){
var url="GoodsServlet"; //服务器地址
var param ="page="+page+"&order=0&nocache="+new Date().getTime(); //请求参数
request=httpRequest("post",url,true,callbackFunc,param); //调用请求方法
}
//Ajax回调函数
function callbackFunc(){
if(request.readyState == 4){
if(request.status == 200){
var doc = request.responseXML;
var pageNum = doc.getElementsByTagName("pageNum")[0].firstChild.data;
var maxPage= doc.getElementsByTagName("maxPage")[0].firstChild.data;
var prePage = doc.getElementsByTagName("prePage")[0].firstChild.data;
var nextPage = doc.getElementsByTagName("nextPage")[0].firstChild.data;
var goodses = doc.getElementsByTagName("goods");
var innerHTML = "";
if((goodses!=null)&&(goodses.length!=0)) {
innerHTML+="<table width='96%' border='1' cellpadding='0' cellspacing='0' bordercolor='#FFFFFF' bordercolordark='#FFFFFF' bordercolorlight='CFCFCF'>";
innerHTML+="<tr align='center' height='30'>";
innerHTML+="<td><a href =\"javascript: orderById("+(parseInt(prePage)+1)+")\">商品编号</a></td>";
innerHTML+="<td>商品名称</td>";
innerHTML+="<td>简介</td>";
innerHTML+="<td>单价</td></tr>";
for(var i=0;i<goodses.length;i++) {
var goods = goodses[i];
var goodsId = goods.childNodes[0].firstChild.data;
var goodsName = goods.childNodes[1].firstChild.data;
var introduce = goods.childNodes[2].firstChild.data;
var price = goods.childNodes[3].firstChild.data;
innerHTML += "<tr height='30'>";
innerHTML += "<td align='left'> "+goodsId+"</td>";
innerHTML += "<td align='left'> "+goodsName+"</td>";
innerHTML += "<td align='left'> "+introduce+"</td>";
innerHTML += "<td align='left'> "+price+"</td>";
innerHTML += "</tr>";
}
innerHTML+="<tr height='30'><td align='center' colspan='7'>";
innerHTML +="["+ pageNum+"/"+maxPage+"] ";
innerHTML += "<a href='javascript:void(0)' onClick=\"getData(1)\">[首 页]</a> ";
innerHTML += "<a href='javascript:void(0)' onClick=\"getData("+prePage+")\">[上一页]</a> ";
innerHTML += "<a href='javascript:void(0)' onClick=\"getData("+nextPage+")\">[下一页]</a> ";
innerHTML +="<a href='javascript:void(0)' onClick=\"getData("+maxPage+")\">[尾页]</a>";
innerHTML+="</td></tr>\n";
innerHTML+="</table>\n";
}else {
innerHTML += "暂时没有任何数据";
}
document.getElementById("goodsList").innerHTML = innerHTML;
request = false;//此处必须设置XMLHttpRequest对象的变量为初始状态
}
}
}
function orderById(page){
var flag = document.getElementById("flag").value;
alert(page);
var url="GoodsServlet"; //服务器地址
var param ="page="+page+"&order="+flag+"&nocache="+new Date().getTime(); //请求参数
request=httpRequest("post",url,true,callbackFunc,param); //调用请求方法
if(flag=="0"){
document.getElementById("flag").value="1";
return;
}
else if(flag=="1"){
document.getElementById("flag").value="0";
return;
}
}
window.onload=function(){
getData(1);
}
</script>
</head>
<body>
<input type="hidden" name="flag" id="flag" value="0"/>
<table width="788" height="236" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="199" height="182" valign="top" bgcolor="#FFFFFF"></td>
<td valign="top" bgcolor="#FFFFFF"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="45" valign="top" > </td>
</tr>
<tr>
<td height="10" valign="top"> </td>
</tr>
<tr>
<td height="94" valign="top" align="center">
<span id="goodsList"></span>
</td>
</tr>
</table></td>
</tr>
</table>
</table>
</body>
</html>
这是我的servlet，主要代码如下：
public class GoodsServlet extends HttpServlet {
private Document doc;
private int pagesize=4;
/**
* Destruction of the servlet. <br>
*/
public void destroy() {
super.destroy(); // Just puts "destroy" string in log
// Put your code here
}
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("UTF-8");
response.setContentType( "text/xml;charset=UTF-8" );//设置响应格式为test/xml
//禁止缓存
response.addHeader( "Cache-Control", "no-store,no-cache,must-revalidate" );
response.addHeader( "Cache-Control", "post-check=0,pre-check=0" );
response.addHeader( "Expires", "0" );
response.addHeader( "Pragma", "no-cache" );
PrintWriter out = response.getWriter();
PageElement pageArgs = getPageArgs(); // 获取数据分页参数
List goodses = null; // 创建数据集合
// 获取请求对象的分页参数
int page=1;
if(null!=request.getParameter("page")){
page = Integer.parseInt(request.getParameter("page"));
}
String order = request.getParameter("order");
pageArgs.setPageCount(page);
out.println( "<?xml version=\"1.0\" encoding=\"utf-8\"?>" );
out.println( "<goodses>" );
out.println( "<pageElement>" );
out.println( "<pageNum>" +pageArgs.getPageNum()+"</pageNum>");
out.println( "<maxPage>" +pageArgs.getMaxPage()+"</maxPage>");
out.println( "<nextPage>" +pageArgs.getNextPage()+"</nextPage>");
out.println( "<prePage>" +pageArgs.getPrePage()+"</prePage>");
out.println( "</pageElement>" );
try{
goodses = getGoods(page,order);
}catch(Exception e){
e.printStackTrace();
}
for(int i=0;i<goodses.size();i++){
CommodityForm commodity = (CommodityForm) goodses.get(i);
out.println( "<goods>" );
out.println( "<id>"+commodity.getId()+"</id>" );
out.println( "<goodsName>"+commodity.getName()+"</goodsName>" );
out.println( "<introduce>"+commodity.getIntroduce()+"</introduce>" );
out.println( "<Price>"+commodity.getPrice()+"</Price>" );
out.println( "</goods>" );
}
out.println( "</goodses>" );
out.close();
}
public List getGoods(final int page,String order) throws Exception {
List list = new ArrayList(); // 创建保存分页数据的集合对象
ConnDB conn = new ConnDB(); // 连接数据库
CommodityForm f =null;
int firstResult = (page-1) * pagesize;
try {
// 定义分页查询的SQL语句
String sql="";
if(order.equals("0")){
sql = "select * from tb_goods order by id asc limit "+firstResult+","+pagesize;
}
else if(order.equals("1")){
sql = "select * from tb_goods order by id desc limit "+firstResult+","+pagesize;
}
ResultSet rs = conn.executeQuery(sql); // 获取查询结果
while (rs.next()) { // 遍历查询结果集
f = new CommodityForm(); // 创建分页对象
f.setId(rs.getInt("id"));
f.setName(rs.getString("name"));
f.setIntroduce(rs.getString("introduce"));
f.setPrice(rs.getFloat("price"));
list.add(f); // 添加分页数据对象到List集合
}
} catch (SQLException ex) {
ex.printStackTrace();
} finally {
conn.close();
}
return list;
}
public PageElement getPageArgs() {
PageElement pag = null; // 声明分页参数对象
Statement stmt = null;
ResultSet rs = null;
ConnDB conn = new ConnDB(); // 连接数据库
try {
// 声明查询总数据量的SQL语句
String sql = "SELECT count(*) FROM tb_goods";
rs = conn.executeQuery(sql); // 执行SQL查询
if (rs.next()) {
int count = rs.getInt(1); // 获取查询结果
pag = new PageElement(); // 初始化分页参数对象
pag.setPageSize(pagesize); // 设置分页大小
pag.setMaxPage((count + pagesize - 1) / pagesize);// 设置最大页码
pag.setPageCount(count); // 设置当前页码
}
} catch (SQLException ex) {
ex.getMessage();
} finally {
conn.close();
}
return pag;
}
public void init() throws ServletException {
// Put your code here
}
}
数据库连接，dao类什么的应该没问题，感觉是dom对象的节点处理出了兼容性问题
...全文
请发表友善的回复…
发表回复
斯洛文尼亚旅游 2017-05-17
- 打赏
- 举报
果然是有空白行了。。有空白行不能用childNodes，空白节点（回车之类的）在标准浏览器下也算一个节点，所以你的childNodes[0]就是空白节点了，再调用firstChild会得到null，再调用data就报了，按照pageNum，maxPage这种使用getElementsByTagName来获取
for(var i=0;i<goodses.length;i++) {
var goods = goodses[i];
var goodsId = goods.getElementsByTagName('id')[0].firstChild.data;
var goodsName = goods.getElementsByTagName('goodsName')[0].firstChild.data;
var introduce = goods.getElementsByTagName('introduce')[0].firstChild.data;
var price = goods.getElementsByTagName('Price')[0].firstChild.data;
[/quote]哇 ，大哥 ，你真的是厉害呀 解决了！能再给我讲讲 是怎么回事儿吗？ 空白行？我之前那样写有什么局限性呢？[/quote]
java不清楚，不过看你的out.println( "<goods>" );这种应该会同时输出一个回车吧，这样就产生空白节点了，自己用stringbuider什么的组合成字符串后一次性输出，去掉回车这种空白节点就可以用childNodes了。。
小牙同学 2017-05-17
- 打赏
- 举报
应该是下面设置的问题 ，数据 都已经传过来了
果然是有空白行了。。有空白行不能用childNodes，childNodes在标准浏览器下也算一个阶段，所以你的childNodes[0]就是空白节点了，再调用firstChild会得到null，再调用data就报了，按照pageNum，maxPage这种使用getElementsByTagName来获取
for(var i=0;i<goodses.length;i++) {
var goods = goodses[i];
var goodsId = goods.getElementsByTagName('id')[0].firstChild.data;
var goodsName = goods.getElementsByTagName('goodsName')[0].firstChild.data;
var introduce = goods.getElementsByTagName('introduce')[0].firstChild.data;
var price = goods.getElementsByTagName('Price')[0].firstChild.data;
[/quote]哇 ，大哥 ，你真的是厉害呀 解决了！能再给我讲讲 是怎么回事儿吗？ 空白行？我之前那样写有什么局限性呢？
斯洛文尼亚旅游 2017-05-17
- 打赏
- 举报
果然是有空白行了。。有空白行不能用childNodes，childNodes在标准浏览器下也算一个阶段，所以你的childNodes[0]就是空白节点了，再调用firstChild会得到null，再调用data就报了，按照pageNum，maxPage这种使用getElementsByTagName来获取
for(var i=0;i<goodses.length;i++) {
var goods = goodses[i];
var goodsId = goods.getElementsByTagName('id')[0].firstChild.data;
var goodsName = goods.getElementsByTagName('goodsName')[0].firstChild.data;
var introduce = goods.getElementsByTagName('introduce')[0].firstChild.data;
var price = goods.getElementsByTagName('Price')[0].firstChild.data;
小牙同学 2017-05-17
- 打赏
- 举报
哦 有<goodses>,漏看了
小牙同学 2017-05-17
- 打赏
- 举报
已按您的指示去做了，结果如下：
在ie中是这样显示的：
在其它浏览器中是这样的：
[/quote]发现 在 其它浏览器中 <goodses>这个标签没有，只有结尾才出现</goodses>
在其它浏览器中是这样的：
[/quote]发现 在 其它浏览器中 <goodses>这个标签没有，只有结尾才出现</goodses>小牙同学 2017-05-17
- 打赏
- 举报
已按您的指示去做了，结果如下：
在ie中是这样显示的：
在其它浏览器中是这样的：
在ie中是这样显示的：
在其它浏览器中是这样的：
斯洛文尼亚旅游 2017-05-16
- 打赏
- 举报
不懂java，你最好贴出你的xml结构，你这个是访问兼容性的问题
不会浏览器调试工具的话可以加下面的js代码序列化为xml字符串
if(request.status == 200){
var doc = request.responseXML;
alert(doc.xml?doc.xml:new XMLSerializer().serializeToString(doc ))
小牙同学 2017-05-16
- 打赏
- 举报
数据库连接，dao类什么的应该没问题，感觉是dom对象的节点处理出了兼容性问题[/quote]
浏览器给出的错误地方
浏览器给出的错误地方
