将'document'与'选择器本身'放在jQuery中？

Question

伙计我有2个问题,我认为这些问题在某种程度上与我有关.第一:

1. 这两者有什么区别:

   $(document).on('click','#someselector', function() {
   
     //do something
   
   });
   

vs这个

$('#selector')on('click', function(){
  /do something
});

有时两者都有效,有时则不然.

第2个问题:

我创建了一个jQuery UI这样的对话框:

function this_dialog(id) {

    $("#div-id-for-the-dialog").dialog({
        autoOpen            : false,
        modal               : true,
        draggable           : false,
        width               : 400, 
        buttons         : [{ 
            id      : id,
            text    : 'Ok' 
        },{  
            text    : 'Cancel',
            click   : function () { 
                $("#div-id-for-the-dialog").dialog('close');
            }
        }]   
    });  

}

正如您所看到的,id被传递给函数,许多人将调用此对话框并将唯一ID传递给它.然后,id将仅分配给Ok按钮.

所以当我调用此函数来加载一个唯一的对话框时:

add_section_complete_reopen_dialog('my-unique-dialog-id'); //passing the id
$('#div-id-for-the-dialog').html("I have a unique dialog now? ok?");

当我用这段代码按ok时:

$(document).on('click','#my-unique-dialog-id', function () {
  //Do some ajax call here
});

我得到了这个JS错误:TypeError: s is undefined 但是ajax是成功的.我只是想知道那个错误是什么.

所以当我说它与第一个问题有关时是因为当我用这个替换点击代码时:

$('#my-unique-dialog-id').on('click', function () {
  //Do some ajax call here
});

它不再起作用了.

谢谢

Answer 1

$(document).on('click', 'someselector', function() ...);

是委托语法.它允许您将处理程序绑定到执行代码时可能不存在的元素.看到:

动态创建元素的事件绑定？

$('someselector').on('click', function() ...);

仅在执行此代码时将处理程序绑定到与选择器匹配的元素.