jquery 动态触发
Sometimes JavaScript toolkits give us so much functionality that we can get hung by it if we're not careful. The more functionality that we use within a toolkit, the more opportunity there is to have one set of changes or additions affect another. That's especially true as you maintain your code over a period of years. One mistake I often see is the use of jQuery's trigger, a method which allows developers to trigger a registered event. It's great that you can do that but DO NOT TRIGGER REAL EVENT NAMES!
有时，JavaScript工具包为我们提供了很多功能，如果我们不小心的话，我们可能会迷上它。 我们在工具包中使用的功能越多，一组更改或添加的内容就会影响另一组的机会就越大。 当您在几年内维护代码时，尤其如此。 我经常看到的一个错误是使用jQuery的trigger ，该方法允许开发人员触发注册的事件。 很高兴您可以这样做，但不要触发真实的活动名称！
Note: I'm aware that other toolkits provide this functionality -- I simply use jQuery as an example because of its popularity and recent problem I saw. This can happen with any toolkit. MooTools uses fireEvent, etc.
注意：我知道其他工具箱也提供了此功能-由于它的受欢迎程度和最近遇到的问题，我仅以jQuery为例。 任何工具包都可能发生这种情况。 MooTools使用fireEvent等。
The following is a prime example of using trigger to accomplish a task:
以下是使用trigger完成任务的主要示例：
// Set up a click event jQuery('.tabs a').on('click', function() { // Switch to the tab, load some content, whatever }); // Trigger a click on the last one jQuery('.tabs a').last().trigger('click');The above would open the given tab at that index. I totally understand why people use trigger for this type of thing; it's usually because the function to trigger said opening is not available globally, and triggering an event is easy and always available. The problem is that using real event names as the trigger can ...trigger... some crazy shit. Let's say this is added somewhere else in the site:
上面的代码将在该索引处打开给定的选项卡。 我完全理解人们为什么要使用trigger来进行此类操作； 通常是因为触发所述打开的功能不是全局可用的，并且触发事件很容易且始终可用。 问题在于使用真实事件名称作为触发器可能会触发一些疯狂的事情。 假设这是在网站的其他位置添加的：
// Listen to all clicks in the body jQuery('body').on('click', 'a', function() { // Do some logic // Condition met, do something drastic! if(conditionMet) { // Reload the page? // Open a submenu? // Submit a form? // ... you get the idea } });Now we have a problem -- the tab trigger click is listened to by something completely separate and now we're in for trouble. Yikes. The best solution if you need to use trigger is providing a custom event name along with the native event:
现在，我们遇到了一个问题-完全分开的内容会监听制表符触发的点击，现在麻烦了。 kes 如果您需要使用trigger ，最好的解决方案是提供一个自定义事件名称以及本机事件：
// Set up a click event with an additional custom event jQuery('.tabs a').on('click tabs-click', function() { // Switch to the tab, load some content, whatever }); // Trigger a fake click on the last one jQuery('.tabs a').last().trigger('tabs-click');Now your event trigger won't cause conflicts with other listeners on the page. The reserved developer in me says that you may want to avoid trigger (and its other toolkit counterparts) all together, but adding a custom event name is the very least you should do!
现在，您的事件触发器将不会与页面上的其他侦听器发生冲突。 我内心保留的开发人员说，您可能想一起避免使用trigger (以及与之对应的其他工具包)，但是添加自定义事件名称是您最不应该做的！
If you're using jQuery specifically, you could also use jQuery's triggerHandler method which triggers an event but only those registered through jQuery, and with the following caveats:
如果专门使用jQuery，则还可以使用jQuery的triggerHandler方法来触发事件，但仅触发通过jQuery注册的事件，并带有以下警告：
The .triggerHandler() method does not cause the default behavior of an event to occur (such as a form submission).
.triggerHandler()方法不会导致事件的默认行为发生(例如，表单提交)。
While .trigger() will operate on all elements matched by the jQuery object, .triggerHandler() only affects the first matched element.
虽然.trigger()将对jQuery对象匹配的所有元素进行操作，但.triggerHandler()仅影响第一个匹配的元素。
Events created with .triggerHandler() do not bubble up the DOM hierarchy; if they are not handled by the target element directly, they do nothing.
用.triggerHandler()创建的事件不会使DOM层次结构冒泡； 如果它们不是由目标元素直接处理的，则它们什么也不做。
Instead of returning the jQuery object (to allow chaining), .triggerHandler() returns whatever value was returned by the last handler it caused to be executed. If no handlers are triggered, it returns undefined
.triggerHandler()不会返回jQuery对象(以允许链接)，而.triggerHandler()返回它导致执行的最后一个处理程序返回的任何值。 如果没有触发处理程序，则返回undefined
The .triggerHandler() method is jQuery's way of preventing the problems that trigger can create.
.triggerHandler()方法是jQuery防止trigger可能造成的问题的方法。
翻译自: https://davidwalsh.name/dont-trigger-real-event-names
jquery 动态触发
