是否有一种方法可以让按键、按键、模糊和更改事件在一行中调用相同的函数,或者我必须分别执行它们?
我的问题是,我需要验证一些数据与数据库查找,并希望确保验证不错过在任何情况下,无论是键入或粘贴到框。
是否有一种方法可以让按键、按键、模糊和更改事件在一行中调用相同的函数,或者我必须分别执行它们?
我的问题是,我需要验证一些数据与数据库查找,并希望确保验证不错过在任何情况下,无论是键入或粘贴到框。
当前回答
如果你将同一个事件处理程序附加到几个事件上,你经常会遇到多个事件同时触发的问题(例如,用户在编辑后按tab键;按键、改变和模糊都可能触发)。
听起来你真正想要的是这样的:
$('#ValidatedInput').keydown(function(evt) {
// If enter is pressed
if (evt.keyCode === 13) {
evt.preventDefault();
// If changes have been made to the input's value,
// blur() will result in a change event being fired.
this.blur();
}
});
$('#ValidatedInput').change(function(evt) {
var valueToValidate = this.value;
// Your validation callback/logic here.
});
其他回答
用内置的DOM方法实现这个很简单,不需要像jQuery这样的大库,如果你想,它只需要更多的代码-迭代一个事件名称数组,并为每个事件添加一个侦听器:
function validate(event) {
// ...
}
const element = document.querySelector('#element');
['keyup', 'keypress', 'blur', 'change'].forEach((eventName) => {
element.addEventListener(eventName, validate);
});
如果你想模拟添加多个元素:
const elements = document.querySelectorAll('.commonSelector');
['keyup', 'keypress', 'blur', 'change'].forEach((eventName) => {
elements.forEach(element => {
element.addEventListener(eventName, validate);
});
});
从jQuery 1.7开始,.on()方法是将事件处理程序附加到文档的首选方法。对于早期版本,.bind()方法用于将事件处理程序直接附加到元素。
$(document).on('mouseover mouseout',".brand", function () {
$(".star").toggleClass("hovered");
})
而不是:
$('#element').on('keyup keypress blur change', function(e) {
// e.type is the type of event fired
});
你可以使用:
$('#element').on('input', function(e) {
// e.type is the type of event fired
});
输入触发键up键按模糊改变事件,甚至粘贴!
但为了防止多重触发:
var a;
var foo = function() {
clearTimeout(a);
a=setTimeout(function(){
//your code
console.log("Runned")
},50);
}
$('textarea').on('blur change', foo);
是否有一种方法可以让按键、按键、模糊和更改事件在一行中调用相同的函数?
可以使用.on(),它接受以下结构:.on(events [, selector] [, data], handler),因此您可以将多个事件传递给该方法。在你的例子中,它应该是这样的:
$('#target').on('keyup keypress blur change', function(e) {
// "e" is an event, you can detect the type of event using "e.type"
});
下面是一个活生生的例子:
$(" #目标”)。On ('keyup keypress blur change',函数(e) { console.log(' ' ${e.type.toUpperCase()}"事件发生') }); < script src = " https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js " > < /脚本> <输入id = "目标" >