Question

通常你会为按钮点击编写一个处理程序，如下所示：

$(document).ready(function()
{

  $("button").click(function()
  {    
    doSomething();
  });
});

但是在event delegator的情况下，要回复具有如下函数的事件：

  function doSomething(event)
  {
    if (ev.target.id == 'button1' )
    {
       //do your stuff
       console.log('#button1 click');
    }
    else
    {
       console.log('not a #button1 click');
    }
  }

我很困惑的是用于定义调用此委托函数的事件的正确语法 - 这个？（A）：

$(document).ready(function()
{
  $(function()
  {
    $('button').click(doSomething);
  });
});

还是这个？（B）：

$(document).ready(function()
{
  $("button").click(doSomething);
});

哪个是正确的，为什么？

Answer 1

在选择A中，您只是重复document.ready语法两次。

// These two lines are equal
$(document).ready(fn);
$(fn);

您需要做的就是选择B

Answer 2

虽然如果你需要使用一个单独的函数，选择B肯定是这样做的方法，即，如果你需要从按钮点击之外的某个地方调用函数，我的偏好通常是放在代码在行。我不这样做的唯一其他时间是它会提高可读性。

$(function() {
    $("button").click( function(e) {
        if (e.target.id == 'button1') {
           alert('button1 clicked');
        }
        ...
    });
});

用于定义事件委托者的正确语法

2 个答案: