检查和重用jQuery事件
使用jQuery向HTML元素添加事件非常简单，但是我发现扩展这些事件并不是一件容易的事。我遇到一个问题，我有一些第三方代码对元素执行操作，因此我需要添加一个事件并从该事件中调用相同的处理程序。由于这是在CMS中，因此我只能将新事件添加到现有代码中，因此我的作用范围有限，因此我需要一种方法来提取当前的jQuery事件，然后分别调用该事件处理程序。这篇文章着眼于我如何做到这一点。
让我们从几个简单的表单输入元素开始。
作为一个有用的示例，我将设置一个“change”事件，该事件会将输入到字段文本中的文本复制到下一字段中。这是一个简单的示例，不需要那么多代码。
var fieldtext = $(".field-text");
var fieldnext = $(".field-next");
var copytext = function() {
fieldnext.val(fieldtext.val());
};
fieldtext.on("change", function(event) {
copytext();
});通过事件设置，我们可以使用jQuery将事件提取到变量中。为了从字段中提取事件数据，我们需要使用一个称为_data的未公开功能。此函数接受我们要检索的元素和数据类型，在这种情况下，我们传递“事件”以获取事件数据。
varevents=$._data(fieldtext[0],"events");
现在，“事件”变量包含与此元素关联的所有事件。我要添加的是一个“keyup”事件，以便当用户停止键入时，我们将等待1秒钟，然后再调用一个名为“doneTyping”的函数。如果用户继续输入，我们将重新启动计数器。这种技术在搜索建议或其他与网络相关的查找中很有用，在这些查找中您需要花一秒钟才能检索内容。通过稍微延迟查找，可以创建更好的用户体验，使他们在打字时不会看到东西突然弹出。
var typingTimer;
var doneTypingInterval = 1000;
fieldtext.on("keyup", function(event) {
clearTimeout(typingTimer);
typingTimer = setTimeout(doneTyping, doneTypingInterval, event);
return false;
});这里的最后一步是调用原始事件处理程序。我们要做的是拉起我们之前创建的事件列表，并运行在找到的每个更改事件上存在的处理程序函数。我们还传入当前事件参数，以确保以与事件处理程序调用事件处理程序相同的方式调用事件处理程序。
function doneTyping(event) {
$.each(events.change, function() {
this.handler(event);
});
}这实际上意味着change和keyup事件运行的是相同的代码，但是由于平台的限制，我们在a回路线中做了一些操作。
如果您想查看所有这些代码的运行情况，那么我创建了一个CodePen，其中包含上面的所有代码。