2009-11-08 51 views
1

我绑定3个事件:绑定事件,停止多个动作

$("#form").bind('keyup change submit',function(event){ 
    //do something 
    alert("test alert"); 
}); 

在一个形式,你可以有文本字段,下拉菜单,复选框,等....

从我注意到了,直到您单击文本框的“外部”之后,才会使用文本字段触发“更改”事件。 因此,我使用“keyup”事件,这对我很有用。
而“提交”事件是不言自明的。 (我基本上是通过绑定这些事件来让自己避免执行多个选择器。) 我可能希望稍后添加更多事件。

这里是我的问题....

弹出警报会触发2次,当我进行了更改一个文本框。不知道这是因为我点击了导致它的弹出窗口上的按钮,或者如果更改文本框中的值也可以同时触发两个键盘弹出的更改事件。

无论哪种方式,这是让我疯了。

有关改进此方法的任何想法,没有多个选择器?

回答

0

为什么不在回调函数之外的某处设置一个布尔标志(仍然在共享范围内)。第一次调用将设置标志并执行,其他人将看到该标志并返回。您可以在用户关闭警告框时重置该标志。

编辑:另一个选项,如果你仍然希望不同的元素能够发出这些警报有处理程序将其本身作为一个事件侦听器。然后,当警报框关闭时,您可以重新注册它。

0

第二个警报由第一个警报触发。当第一个警报弹出时,文本字段失去焦点并触发更改事件。如果真正的处理程序不会导致文本字段失去应该不成问题的焦点。但是,您可能想要忽略文本字段中的更改事件,因为您已经在使用关键字来处理这些字段。
使用从瑞安林奇旗的想法,你可以做到以下几点:

var target = null; 
$("#form").bind('keyup change submit',function(event){ 
    if (event.type == 'keyup') { 
     target = event.target; 
    // a change event after one or more keyup events in the same element 
    } else if (event.type == 'change' && target === event.target) { 
     //do nothing 
     return false; 
    } 
    // actual handler code 
    alert(event.type) // test code 
}); 

测试在Firefox浏览器。我希望这有帮助。

+0

当然'target === event.target'总是为false,因为'target'是未定义的? – Eric 2009-11-08 13:13:02

+0

在触发按键事件之前,'target'为'null'。当用户输入时,会触发多个按键事件,从而将“target”设置为当前元素。当该元素上的变化事件触发时(失去焦点后)'target === event.target'为true。 – 2009-11-08 17:56:21

1

编辑:我刚刚看到你的笔记“没有多个选择器”。如果需要的话,可以将以下链接链接起来,如果这样可以以某种方式符合该法案。

为了最有效的记忆,我会把它分解成几个语句。

//Your function 
var handler = function(e) { alert('blah'); }; 

$('#form input[type=text], #form textarea').keyup(handler); 
$('#form select, #form checkbox, #form radio').change(handler); 
$('#form').submit(handler); 

这很好,因为元素只触发一个事件,而且它可以帮助您。

请注意,如果您期望支持IE 6,那么在复选框/收音机/选择模糊之前不会触发更改事件,因此您可能想要以不同的方式处理它们(点击仍适用于复选框/无线电)。

+0

OP应该*真正*分裂它,而不是通过if-soup令一个单一的整体doitall变得复杂。 – 2009-11-16 23:45:05