jQuery 绑定事件序列

Question

编辑：问题是我使用.select()而不是.find();

我有这个简单的 jQuery 代码（jsfiddle： http://jsfiddle.net/periklis/znstj/ ）

<div class = "someclass"><button class = "myclass">clickme</button></div>
<script>
$(document).ready(function() {
    $('.someclass').select('.myclass').bind('click', function() { console.log('red'); });    
    $('.myclass').bind('click', function() { console.log('green'); });
});
</script>

为什么“绿色”总是在“红色”之前打印？ （我将如何更改它以使“红色”出现在“绿色”之前？）

Answer 1

如所写，您的.select()调用是空操作 - 在 jQuery 中，它用于为onselect事件注册处理程序！

由于.select()是一个链接 function，返回调用它的原始 object，结果是您已将第一个click处理程序绑定到外部.someclass div。

因此，您看到的是冒泡的效果，点击首先点击按钮（“绿色”），然后按此顺序向上冒泡到其父级（“红色”）。

如果您调用.select()的目的是将第一个点击处理程序绑定到按钮，那么您应该使用.children('.myclass')来代替。

Answer 2

您可以绑定自己的自定义函数：

$('.myclass').click(function(){ 
      $(this).trigger('green');
      $(this).trigger('red');
   })

$('.myclass').bind('green', function(e) {
   console.log('green');
});

...

但是，不推荐使用bind ，取而代之的是.on() -> http://api.jquery.com/on/