jQuery绑定(bind())或监听(on())自定义事件时，触发器(trigger)未被激活

Question

有人能告诉我为什么这段代码不能正常工作吗？

$('body').on('test', function() {
  alert('test');
});

$('body').trigger('test');

我正在使用 jquery-1.7.2.min。没有错误，但什么也没发生。

我尝试将代码放在内联脚本中、放在$(document).ready() 中，但仍然没有效果。我也尝试了on() 和 bind()，但都没有结果。我看到很多例子都展示了相同的语法，那么这里有什么不同之处？

- iamface

---

它在这里运行良好，请查看：http://jsfiddle.net/joycse06/XXXhQ/ - Prasenjit Kumar Nag

是的，您的语法与自定义事件配合使用。 - mprabhat

奇怪..这些例子都能运行，但是在我的页面上却不能。我今天早上刚把jQuery从1.6.4更新到了1.7.2，也许是服务器缓存的问题？我知道on()直到1.7才被实现。 - iamface

警告(jQuery.fn.jquery);将检查您的版本，或者警告(typeof jQuery.fn.on);以确认该函数是否存在。 - Jeff

我要补充一下，确保你没有重复引入jQuery（即在注册.on时使用的jQuery对象必须与调用.trigger时使用的jQuery对象（即$）相同，否则如果稍后加载了另一个$实例，则几乎会擦除使用第一个$ jQuery对象设置的原始回调。旧/原始的jQuery对象将被删除，新的jQuery对象（$）将取代第一个对象（事件侦听器也将消失）。 - Coty Embry

Answer 1

看起来问题在于DOM的某种准备方式。将代码放置在内联脚本中无效。将其放置在$(document).ready()中与匿名函数一起使用可以工作，但是对于某些原因，使用'( )'的函数调用不能工作... 这段代码有效。

$(document).ready(start);
function start(){
$('body').on('test', function() {
  alert('test');
});

$('body').trigger('test');
}

但是这并没有... *注意函数调用括号。

$(document).ready(start());
function start(){
$('body').on('test', function() {
  alert('test');
});

$('body').trigger('test');
}

在jsfiddle上，精确的示例可以双向工作，但由于某些原因，在我的服务器上只有一种方式有效。这可能引出另一个问题，即为什么，但至少我们可以看到这段代码确实可行，我的东西存在一些奇怪的异常情况 :/

- iamface

---

那是因为你的语义不正确。start()将传递您的启动函数的返回值。而start会传递要在文档准备好时执行的函数。通常，人们会传递匿名函数：$(function() {/我的代码/}); - Jeff

谢谢，这对我也起作用了。在“on”声明周围添加文档准备好函数就可以了！ - rf_wilson

Answer 2

尝试委托：

$(document).on('test', 'body', function() {
  alert('test');
});

$('body').trigger('test');

这个函数的作用类似于之前的live()函数。http://api.jquery.com/live/

- Jeff

---

你的代码并不反映 OP 想要的。OP 的问题不是委托，而是自定义事件。 - thecodeparadox

这是一个自定义事件，你是正确的，他的代码应该可以工作的。我从经验中知道，有时候以这种方式（甚至是自定义事件）绑定事件比直接绑定更容易。从文档中可知：事件处理程序仅绑定到当前选择的元素；它们必须在页面上存在，并且在您的代码调用.on()时存在。当然，body应该存在，但是在他们的情况下会发生一些奇怪的事情，我们看不见，这样做就可以克服这个问题。（理论上）。;) - Jeff