从同一文本输入中捕获多个 onkeyup 事件

Question

我正在为 dom 脚本创建一些逻辑，最终发现我需要在按键时执行多个方法的问题。似乎最后一个定义的onkeyup 是执行的，这里有一些代码：

第一种方法：

...var elements=$$('[id^='+table+']&[id$='+tableField+']');

elements.each(function filter(item) {
    
    //for each item 
    item.onkeyup = function() { ...

第二种方法：

...//for each referenced input    
for(var i=0, fields=htmlFieldElems.length;i<fields;i++){

   //set keyup event for involved fiels in the expression
   $(htmlFieldElems[i]).onkeyup = function() {...
        

可能会发生两种方法中的输入元素可能相同，并且在发生变化时都需要执行......那么处理这个问题的最佳方法是什么？

Answer 1

这是我使用 jQuery 所遵循的。这是example

$('#element').bind('customE',function(){
   // do some stuff
});

$('#element').bind('customE',function(){
   // do some other interesting stuff else use one event handler :-)
});

$('#element').bind('customE',function(){
   // still another
});

$('#element').on('keyup',function(){
    $('#element').trigger('customE');   
});

希望这会有所帮助..即使发布的其他答案也会有所帮助..但这很容易维护:-)

Answer 2

在纯 javascript 中，您可以从 onkeyup 事件处理程序中调用多个方法，就像这样 ...

item.onkeyup = function() {
    func1();
    func2();
    funcn();
}

如果您使用的是 jQuery 等框架，则可以继续添加事件，如下所示：

$('#item').keyup(func1);
$('#item').keyup(func2);
$('#item').keyup(funcn);

原型：

$('foo').observe('keyup', function(event) {
    func1();
    func2();
    funcn();
});