jquery 克隆clone()使用实例

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);
        }
    });
}