JQ~trigger与bind,触发与绑定何先何后?

最近在做项目时,遇到一个需求,事实上就是表单联动的问题,单击单选框,下面的复选框联动,当第一次加载时,默认触发第一个单选框,如图:

之前的方法,没有完成我的要求,第一次加载时,公司被选中,再“角色”这块并没有触发指定事件,代码如下:

    //首次加载时,模拟Dept单击事件
    $("input[name=Dept]").first().trigger("click");
 
   //Dept单击事件
    $("input[name=Dept]").live("click", function () {
        var deptid = $("input[name=Dept]:checked").val();
        if (deptid == undefined)
            deptid = $("input[name=Dept]").first().val()
        $.get("/Common/PartialRole", { deptID: deptid }, function (data) {
            $("#roleList").html(data);
        });
    });

经过分析,找到了原因,JQ的代码为顺序执行,当你执行到trigger时,下面的live方法会没有执行,这时,你触发的click事件是空的,所以,当然程序首次加载时

只是单选按钮被选中,事件方法主体并没有被触发,其它不是没有触发,而是方法本身是空的

将trigger与live的顺序对调,效果实现

    //Dept单击事件
    $("input[name=Dept]").live("click", function () {
        var deptid = $("input[name=Dept]:checked").val();
        if (deptid == undefined)
            deptid = $("input[name=Dept]").first().val()
        $.get("/Common/PartialRole", { deptID: deptid }, function (data) {
            $("#roleList").html(data);
        });
    });
    //首次加载时,模拟Dept单击事件
    $("input[name=Dept]").first().trigger("click");

这时,再运行代码,程序执行到trigger代码段时,click方法已经被执行,这时,再进行trigger的触发,当然结果也就出来了。

小知识:JQ程序与其它程序执行的方式是相同的,代码自上而下运行,当然程序代码会更新你的条件语句改变执行的顺序,这是必然的,这个例子告诉我们,在使用trigger时,应该将它放到你触发的方法的下面,而不要放在上面!

posted @ 2013-05-06 11:01  张占岭  阅读(2576)  评论(0编辑  收藏  举报