jQuery之方法绑定(事件注册)代码小结

Posted 2020-10-23 轴轴

1.最直接的模式,直接将一个function对象传入方法函数,如下面的click(),好处坏处一看便知

$("#btnComfirmChooseCompany").click(function () {
    var companyName = "";
    var companyID = "";
    var hasChecked = false;
    var allCheckbox = $("input[name=‘companyID‘]");
    for (var i = 0; i < allCheckbox.length; i++) {
        if (allCheckbox[i].checked == true) {
            hasChecked = true;
            companyID = $(allCheckbox[i]).attr("value");
            companyName = $("#"+companyID).parent().next().text();
        }
    }
    //略
});

2.等价写法之,将function独立定义给一个变量

function ComfirmChooseCompany(e) {  //e是可选参数
    //同上,略
}
//或
var ComfirmChooseCompany = function(){
}

然后将变量传入JS事件函数,效果感觉一样,但至于有什么差异有待理解

$("#btnComfirmChooseCompany").click(
    ComfirmChooseCompany; //可以运行,思考...Company后加了小括号,是什么效果? 答:ComfirmChooseCompany直接运行了
);

$("#btnComfirmChooseCompany").click(function(){
        ComfirmChooseCompany(); //等价写法,思考这行当小括号是否可以省略
    }
);

3.bind方法

$("#allCheck").bind("click", function () {
    $("[name = $chkItem]:checkbox").attr("checked", $(this).attr("checked"));
});

4.delegate方法

$("body").delegate("#tb_2 tr", "click", function () {
    $(this).addClass(‘tr_color‘).siblings("tr").removeClass("tr_color");
});