WEB项目中脚本的位置是十分重要的,尤其在用户体验方面。 开发过程中可能需要动态创建hmtl控件,如使用提交服务器方法来实现实在是体验差,当前页面数据保存也是个麻烦事,jquery提供了clone()方法,其中有一个参数:
true:克隆指定对象所以内容,包括控件,值,事件。
flse:克隆内容,事件不会克隆。
实例如下:
//添加任务
function addTask() {
var taskNum = $(".divTask").size();
if (taskNum >= 5) {
dlg.Msg.Inf("最多只能添加5个预习任务");
return;
}
var theNextUploaderSerialNo = fileUploaderNum + 1;
//克隆模板
var $divTaskTemplate = $("#divTaskTemplate").clone(true).removeAttr("id").addClass("divTask").show();
//定义ID
$("#uploadFile", $divTaskTemplate).attr("id", "uploadFile" + theNextUploaderSerialNo);
$("#uploadFileShowPanel", $divTaskTemplate).attr("id", "uploadFileShowPanel" + theNextUploaderSerialNo);
var $theLastDivTask = $(".divTask:last");
var isNeedCopyData = $("#toolAdd :checked", $theLastDivTask).size() > 0 ? true : false;
if (isNeedCopyData) {
updateData($theLastDivTask, $divTaskTemplate);
}
//插入到页面
$("#divTaskTemplate").before($divTaskTemplate);
//绑定事件跟序号排列
bindUploadEvent(theNextUploaderSerialNo);
$(".divTask").each(function (i) {
if (i < taskNum) {//前N-1个任务
$(this).find("#toolAdd").removeClass().height(25).empty();
}
else {//最后一个任务
$(this).find("#lblSerialNo").text(i + 1);
}
});
}