0

基本上有多个选项可以使用 javascript 捕获“onclick”事件。

的HTML：

<div id='menu'>
  <button>Title</button>
</div>

以下几个 jQuery 选项：

<script>
var menu = $('#menu');
var buttons = menu.find('button').click(menuEvent);

function menuEvent() {
  ..
}
</script>

<script>
var menu = $('#menu');
var buttons = menu.find('button');

buttons.click(function() {
  ..
});
</script>

<script>
var menu = $('#menu');
var buttons = menu.find('button');

buttons.get(0).onclick = function() {
  ..
});
</script>

现在它们看起来都一样，而且它们可能并不比彼此快。那么这三种方法中的哪一种是“最好的”方法，或者可能有更好的方法？

我知道你可以只用 javascript 来做到这一点，但我还是打算使用 jQuery，所以它可能会在不必要的时候使事情复杂化。

4

2 回答 2

2

最好的一个是：

buttons.on("click", function(event){
// code to run on click
});

更多信息在这里：http ://api.jquery.com/on/

于 2012-01-28T10:29:02.107 回答
1

我不知道在您公开的方法中是否存在概念上的最佳方法。它更多地取决于上下文。

  • 如果您只想将事件处理程序附加到按钮，则可以这样做：

    buttons.click(function() {
  ..
});

  • 如果应该为不同的元素组共享相同的处理程序，您可以单独定义处理程序并用于不同的组：

    function myClickHandler() {
    ...
}

buttons.click(myClickHandler);
otherButtons.click(myClickHandler);

  • .on()用于事件委托。当绑定发生后应该将事件处理程序添加到插入到 DOM 中的元素时，您应该转向事件委托。基本上，您将事件“绑定”到父容器，使用选择器限制其执行到相关元素：

    container.on('click', '.button', function() {
    // will execute when clicking on elements with class .button
    // present inside the container
});
于 2012-01-28T10:40:15.890 回答