JQuery 调试

踏雪寻梅

一、IE兼容问题
 
IE6对标准的支持确实太差，本以为用了jQuery可以屏蔽浏览器之间的差异，发现不是那么回事，在FF上能运行正常的JS，到IE上就是没反应。
下面脚本，有两个功能，一个是页面加载时，通过ajax填充select数据，另一个是select change事件发生时，发送ajax请求改变页面table列表。
 
脚本一、FF上通过，IE不起作用
 
 
/*==========加载时执行的语句==========*/$(function(){$.getJSON(ctxpath + "/orgmodel/roletype.do",{ "method": "ajaxGetAll" }, function(data, textStatus){$.each(data, function(i, n){var option = new Option(n.name, n.id);$("#typeSelect").append($(option));});});$("#typeSelect").change(function(event){value = $("#typeSelect").val(); $("#tbody").empty();$.getJSON(ctxpath + "/orgmodel/roletype.do",{ "method": "ajaxGetRoleList","roletypeid":value}, function(data, textStatus){$.each(data, function(i, n){j = i + 1;var tr = $("<tr/>");td1 = $("<td width='4%' align='center'>" + j + "</td>");td2 = $("<td/>");input = $("<input type='checkbox' name='ID' value='" + n.id +"'/>");if(n.disabled){input.attr("disabled","disabled");}a = $("<a href='" + ctxpath + "/orgmodel/globalroleaction.do?action=FindRoleByID&roleid=" + n.id + ">" + n.name + "</a>");td2.append(input).append(a);tr.append(td1).append(td2);tr.appendTo($("#tbody"));});});});}) 
脚本二、FF、IE都能通过
 
 
$(function(){$.getJSON(ctxpath + "/orgmodel/roletype.do",{ "method": "ajaxGetAll" }, function(data, textStatus){$.each(data, function(i, n){//var option = new Option(n.name, n.id);//$("#typeSelect").append($(option));var option = $("<option value='" + n.id + "'>" + n.name + "</option>");$("#typeSelect").append($(option));});});$("#typeSelect").change(function(event){value = $("#typeSelect").val(); $("#tbody").empty();$.getJSON(ctxpath + "/orgmodel/roletype.do",{ "method": "ajaxGetRoleList","roletypeid":value}, function(data, textStatus){$.each(data, function(i, n){j = i + 1;var tr = $("<tr/>");var td1 = $("<td width='4%' align='center'>" + j + "</td>");var td2 = $("<td/>");var input = $("<input type='checkbox' name='ID' value='" + n.id +"'/>");if(n.disabled){input.attr("disabled","disabled");}var a = $("<a>" + n.name + "</a>");a.attr("href",ctxpath + "/orgmodel/globalroleaction.do?action=FindRoleByID&roleid=" + n.id );td2.append(input);td2.append(a);tr.append(td1).append(td2);tr.appendTo($("#tbody"));});});});}) 
 
“脚本一”中总共写了两段代码，IE居然一个都不能通过，太不给面子了！还好，通过其它方式，最终运行起来了。
 
二、IE缓存问题
      在使用ajax get请求情况下，IE使用缓存数据，FF不存在这种情况。
      换成Post方式，问题就解决了。
 
三、中文问题
      使用get请求，参数附加在url上，会出现中文问题，我用的Tomcat，要解决也可以，把Tomcat容器URIEncoding设成utf-8，但这样不通用。换成Post方式提交，问题解决。