日期:2014-05-16  浏览次数:20384 次

这个诡异的Jquery多次事件绑定怎么解决?
list下的超链接a是通过AJAX 加载的,
add_save 按钮是固有不变。
现在的情况是,每次执行list()方法是,始终会对add_save 按钮绑定click事件。
if($(this).data("events") == undefined)没有起到作用。
造成的后果是,点击add_save一次 会执行N次该按钮对应的方法。



HTML code

<div id="list">
<a href="#" id="edit_1">aaa</a><a href="#" id="edit_2">bbb</a>
</div>
<input type="button" id="add_save" value="保存" />


JScript code

function user(){
    this.username = null;
    this.password = null;
    this.id=0;
    this.container = null;
    this.afterFun = null;
    this.eventTarget = null;
    this.result = [false,false,false];
}
user.prototype.list = function(){
    var o = this;
    var container = $(o.container);
    container.html("<td colspan='3' align='center'><img src='../Codebase/Images/Icon/loading.gif' align='absmiddle' />数据加载中...</td>");
    $.ajax({
       type: "POST",
       url: "/ASHX/userList.asp",
       success: function(msg){
         container.html(msg);
         if (o.afterFun){
            o.afterFun.call(this,o);
         }
       }
    }); 
}

user.prototype.eventBindHandler = function(){
    var o = this;
    $(o.eventTarget).each(function(i){
        if($(this).data("events") == undefined){
            $(this).bind("click",{ids:$(this).attr("id"),user:o},function(event){
              var user = event.data.user;
              var arr = event.data.ids.split("_");
              switch(arr[0].toLowerCase()){
                case"add":
                    if(user.check()){
                        user.id = 0;
                        user.update();
                    }else{
                        $("#Err").html("<img src='../Codebase/Images/Icon/Errors.gif' align='absmiddle' />用户名或密码设置有误,请检查!");
                        setTimeout(function(){$("#Err").html('')},3000);
                    }
                break;
                
                case"edit":
                    //启动编辑器
                break;
                
                case"delete":
                    if(confirm('确实要删除选中用户吗?')){
                        user.id = parseInt(arr[1]);user.delete();
                    }
                break;    
            }
            event.stopPropagation();
          });
        }
    });
}
/*************** 前台调用如下******************/
var admin = null;
$(function(){
    admin = new user();
    admin.container = "#list a,#add_save";
    admin.afterFun = function(){
        var parentWin = new win();
        parentWin.container = "#win";
        parentWin.resetSize();
        admin.eventTarget = "#list a,#add_save";
        admin.eventBindHandler();
    }
    admin.list();    
});







------解决方案--------------------
list()

外面设置一个全局变量,var count=0;

进入list就 count就加1

判断,count的值,如果=1,就执行你的绑定方法,如果大于1,就不执行。

以后再找机会 初始化count

------解决方案--------------------
看得头晕
使用live()方式对#list a进行事件绑定
按钮就直接:
JScript code
$('#add_save').click(function(){
  //事务处理
})