jQuery绑定事件完全不起作用

Question

我尽力让它实现，但未能成功。

问题在于我在运行时创建了一个元素，然后将一个函数绑定到该元素上，如下面的代码所示：

$(document).ready(function() {

  $('.rem').click(function() {
    $("body").append('<a id="runtime" href="javascript:void(0);">runtime</a>');
  });

  $('#runtime').bind('click', func_name());

});

//End of doc
function func_name() {
  alert('I got it!');
}

在HTML代码中，我有一个如下所示的标签：

<div id="body">
  <label class="rem">click me</label>
</div>

我第二次尝试

$(document).ready(function() {

  $('.rem').click(function() {
    $("body").append('<a id="runtime" href="javascript:void(0);">runtime</a>');
  });

  $('#runtime').bind('click',function() {
    alert($(this).text());
  });

});
//End of doc

HTML代码：

<div id="body">
  <label class="rem">click me</label>
</div>

- Alireza

Answer 1

更改

$('#runtime').bind('click',func_name());

to

$('#runtime').live('click',func_name); 

或者（自jQuery 1.7起）：

$('#runtime').on('click',func_name); 

需要注意两点：

1. 我将func_name()更改为func_name。在绑定处理程序时，您不想调用函数-您只想引用它。
2. 调用bind没有任何好处，因为#runtime直到单击.rem后才存在。这就是为什么您需要使用live或on（取决于您的jQuery版本）的原因。

为了安全起见：这里有一个关于为什么应该使用jQuery.on的好参考。

- Chris Tonkinson

---

我使用jQuery 1.7.1，live方法可以工作，但是.on()方法无法工作。 - Alireza

Answer 2

你不想在代码的某个点运行该函数，因此删除()：

$('#runtime').bind('click', func_name);

如果您正在使用jQuery 1.7+版本，则应该使用.on()方法：

$('#runtime').on('click', func_name);

或者直接使用.click()处理程序：

$('#runtime').click(func_name);

- Kevin Ji

---

我使用 jQuery 1.7.1.min.js，但是 .on() 方法没有起作用（我从函数中删除了括号）。 - Alireza

我认为 .click() 不太好用，因为我的元素是在运行时添加的，我需要将事件绑定到它上面！ - Alireza

Answer 3

//-------------------------------------------------------
//  event bind
//  ex) $U.eventbind(window,"onresize",chart_common.draw);
//-------------------------------------------------------
,   eventbind   :
        function (vobj, vEvent, pFunction, vrecheck) {
            
            let obj = vobj;
            if (typeof(vobj) === "string"){
                obj =   $hD(vobj);  
            }
            
            let vFunction   =   pFunction.bind();   
            let vkey            =   pFunction.toString().replaceAll(/ /g,"");
            $GC._U_EVENT_CAPTION.push(vkey)
            $GC._U_EVENT_OBJ.push(vFunction);
                
            if ($U.isNull(obj)){
                if (vrecheck === true){
                } else{
                    setTimeout(function(){  //--**  화면로드등으로 인해 시간이 지체되는 경우 3초뒤 한번더 체크
                        $U.eventbind(vobj, vEvent, vFunction, true);
                    },3000);                    
                } 
                return;
            } 
            
            if (obj === window){
                    obj.addEventListener(vEvent.substring(2), vFunction, {capture:false,once:false,passive:$GC._BROWSER_MOBILE_CHK} );
                    return;
            }
            
            if ($U.isNullOrEmpty(vFunction)) return;
            if ($U.isNull(obj.length) || obj.length === 0){
                if (obj.addEventListener){
                    obj.addEventListener(vEvent.substring(2), vFunction, {capture:false,once:false,passive:$GC._BROWSER_MOBILE_CHK} );
                } else {
                    if (obj[vEvent]){
                        obj.attachEvent(vEvent, vFunction);
                    } else {
                        obj[vEvent] =   vFunction;
                    }
                }
            } else {
                for (var q=0,eoobj;eoobj=obj[q];q+=1){
                    if (eoobj.addEventListener){
                        eoobj.addEventListener(vEvent.substring(2), vFunction, {capture:false,once:false,passive:$GC._BROWSER_MOBILE_CHK} );
                    } else {
                        if (eoobj[vEvent]){
                            eoobj.attachEvent(vEvent, vFunction);
                        } else {
                            eoobj[vEvent]   =   vFunction;
                        }
                    }
                }
            }
        }

//-------------------------------------------------------
//  event unbind
//      addEvent 시 리턴받은 토큰이나 function Name 로 사용시
//-------------------------------------------------------
,   eventunbind :
        function (vobj, vEvent, pFunction, vrecheck) {

            let obj = vobj;
            if (typeof(vobj) === "string"){
                obj =   $hD(vobj);  
            }
            
            let vFunction   =   pFunction;
            let vkey            =   pFunction.toString().replaceAll(/ /g,"");
            for(let iuyt=0,chkey; chkey=$GC._U_EVENT_CAPTION[iuyt]; iuyt+=1 ){
                if (chkey === vkey){
                    vFunction   =   $GC._U_EVENT_OBJ[iuyt];     
                }   
            }
            
            if ($U.isNull(obj)){
                if (vrecheck === true){
                } else{
                    setTimeout(function(){  //--**  화면로드등으로 인해 시간이 지체되는 경우 3초뒤 한번더 체크
                        $U.eventunbind(vobj, vEvent, vFunction, true);
                    },3000);                    
                } 
                return;
            } 
            
            if (obj === window){
                    obj.removeEventListener(vEvent.substring(2),vFunction, {capture:false,once:false,passive:$GC._BROWSER_MOBILE_CHK} );
                    return;
            }
            
            if ($U.isNull(obj.length) || obj.length === 0){
                if (obj.removeEventListener){
                    obj.removeEventListener(vEvent.substring(2),vFunction, {capture:false,once:false,passive:$GC._BROWSER_MOBILE_CHK} );
                } else {
                    if (obj[vEvent]){
                        obj[vEvent] =   null;
                    } else {
                        try{
                            obj.detachEvent(vEvent, vFunction);
                        } catch(e){
                        }
                    } 
                }
            } else {
                for (var q=0,eoobj;eoobj=obj[q];q+=1){
                    if (eoobj.removeEventListener){
                        eoobj.removeEventListener(vEvent.substring(2),vFunction, false );
                    } else {
                        if (eoobj[vEvent]){
                            eoobj[vEvent]   =   null;
                        } else {
                            try{
                                eoobj.detachEvent(vEvent, vFunction);
                            } catch(e){
                            }
                        } 
                    }
                }   
            }
        }

- 이상준

---

你的回答可以通过添加更多关于代码的信息以及它如何帮助提问者来改进。 - Tyler2P

Answer 4

尝试一下。

$(document).ready(function(){

    $('.rem').click(function(){
        $('<a id="runtime" href="javascript:void(0);">runtime</a>').bind('click',func_name).appendTo("body");
    });
});//End of doc
function func_name(){
    alert('I got it!');
}

由于您在对象创建之前绑定了它，因此您没有得到期望的结果。

- Tejasva Dhyani