html、js、jsp开发记录

1.常见问题 （以下问题基于JQuery1.5、HTML4、css2）

如果从struts中传过来的是null，在js中既等于undefined又等于null，且，比较的true或false的时候要打括号，不然结果不对。

至于是为什么是这样，我也不清楚。例如：

alert("ruleId--undefined---"+ (ruleId == undefined));//输出true

alert("ruleId--null----"+ (ruleId == null));//输出true

只有值等于""或者undefined的时候，传到action才会被struts2把java中的各中数据的包装类（如Integer、Long）设置为null

声明一个js变量且不赋值，那么此时它即是是null又是undefined。

如果文本框中没有填入值，用JQuery获取的值为""

如果document Object的某个属性没有值，用JQuery的attr方法获得的就是""

alert("$(#sssssss) 2== " + $("#sssssss"));//即使id="sssssss"的元素不存在，也是Object，而不是null

var sendData = {};//此时sendData == Object，但sendData.length == undefined

2.//JQuery添加聚焦和失焦的方式

$("#limitStuCount").hover(function(){

setCheckbox($("#limitStuCountRadio"),"checked");

},function(){

if($(this).val() == "") setCheckbox($("#limitStuCountRadio"),"");

});

Juery中聚焦事件：

$("#id").focus(function(){

});

失焦事件：

$("#id").blur(function(){

});

但是文本改变事件却不能这样写：

$("#id").change(function(){

});

文本改变事件可以这样写,propertychange是属性改变时触发事件

$("#id").bind("propertychange",function() {

});

3.js数组作为data传到Action,action接收不到或者说struts不知道怎么处理传来的数组。

有的人说，那直接把js数组作为data传到Action不是很方便？答案是不能这样传，这样action接收不到或者说struts不知道怎么处理传来的数组。

只能通过集合的形式传数组

数字集合：data:{

"termSchoolCourseIdList[0]": 1,

"termSchoolCourseIdList[1]": 2

}

对象集合：data:{

lstStu[0].num:"1",lstStu[0].name:"xy1",

lstStu[1].num:"2",lstStu[1].name:"xy2",

lstStu[2].num:"3",lstStu[0].name:"xy3"

}

4.在引用的js、jsp、css、html等文件的地址后面加上参数的作用：

第一、脚本并不存在，而是服务端动态生成的，因此带了个版本号，以示区别。

第二、客户端会缓存这些css或js文件，因此每次升级了js或css文件后，改变版本号，客户端浏览器就会重新下载新的js或css文件 ，刷性缓存的作用。大家可能有时候发现修改了样式或者js，刷新的时候不变，就是客户端缓存了css或者js文件，因此加上参数还是有好处的！

第二种情况最多，也可能两种同时存在。

5.JQuery的each

$.each(data.datas,function(i,item){

if(item.isCuur == 1 ){

currentTermId=item.id;

}

$("#select_termId").append("<option value='"+item.id+"' >"+item.termName+"</option>");

});

$(".schoolElectiveCourseRow:checked").each(function(index,domEle){//此时的domEle是document 对象而不是JQuery对象

alert("index == " + index);

sendData["termSchoolCourseIds["+ index +"]"] = $(this).val();

});

在JQuery each循环中，return只是退出循环，并不是让整个执行过程结束。

6.在JQuery的$.ajax();

在JQuery的$.ajax();中

return true或false，只是给ajax()这个方法一个返回值并会执行ajax()后面的代码，并不是给ajax()上面的function返回一个值。

7.阻止元素的默认行为，

如下：

//禁用删除申请按钮，并设置为灰色

var aObj = $("#delete"+ sendData["termSchoolCourseDto.ids["+ i +"]"]);

aObj.attr("class","grayFont");

aObj.click(function (domEle){

domEle.preventDefault();//阻止元素的默认行为，这里是取消a标签的href事件

});

8.浏览器兼容问题：

8.1.在I8下面，如果input标签设置为只读的，按键盘上的“退格键”就会使浏览器直接返回上一个浏览页面

8.2.IE8不支持$("#addCourseTr").html()，可以用<script id="addCourseTr" type="text/x-jquery-tmpl"></script> 中的tmpl()，如：$("#addCourseTr").tmpl()

Jquery.tmpl.min.js：

8.3.在IE8中，通过live绑定的change事件只有在单击页面的某个地方后才会触发，可以把$("#importInputFile").live("change",function(){}); 改成→ $("#importInputFile").change(function(){});

8.4.在I8下面，如果input标签设置为只读的，按键盘上的“退格键”就会使浏览器直接返回上一个浏览页面

8.5在IE8中，如果input的value没有设置默认值（即value=””或value=”xxx”）,那么用纯js的数组获取其中元素的value值的时候，就会报错：SCRIPT5007: 无法获取未定义或 null 引用的属性“value”，如：

①var classRooms = $( addCourseTBody.find("input[name='classRoom']") );

var classRoom = $.trim( classRoomObj.value );

if(isNotEmpty(classRoom) && classRoom.length >100){

alert("教室长度不能超过100个字符！");

classRoomObj.focus();

return;

}

①这种方式会报错，classRoomObj.value》SCRIPT5007: 无法获取未定义或 null 引用的属性“value”

②var classRooms = $( addCourseTBody.find("input[name='classRoom']") );

var classRoomObj = $(classRooms[i]);

var classRoom = $.trim( classRoomObj.val() );

if(isNotEmpty(classRoom) && classRoom.length >100){

alert("教室长度不能超过100个字符！");

classRoomObj.focus();

return;

}//② 这种用JQuery对象获取value的方式就没问题

9.JQuery绑定change事件问题

通过JQuery绑定<input id="importInputFile" type="file"/>的change事件（$().change）只能被触发一次，，，不管上传失败还是成功,（谷歌、火狐也一样）

还是只能在标签上绑定了：<input id="importFile" onchange="javascript:$('#importFileName').val(this.value)"