2013-05-06 65 views
1

我有一个网站,有几个按钮,打开不同的jQuery UI对话框。点击事件在IE中打开错误的对话框

其中一个对话框(ID为filter_story)是一个文本字段,用户可以在该字段中键入稍后用于在轮询服务器时过滤故事的关键字。我设置了文本字段,以便用户可以输入多个关键字,在输入每个项目后单击类别approve_filter_item的按钮,或者用户只需单击每个关键字之间的enter按钮即可。

// button to open the keyword filter list 
$("#filter_stories").click(
    function(){ 
     $("#filter_dialog").dialog("open"); 
    } 
); 

$(".approve_filter_item").click(function(){ 
    [process the just inserted keyword and then put focus back on the textfield] 
}); 

//listen for enter key when user's focus is on entering a new keyword 
$(".new_filter_item").keydown(function (e) { 
    if (e.keyCode == 13) { 
    $($(this).parents("tr")[0]).find(".approve_filter_item").click(); 
    } 
}); 

// button to show the post story dialog form 
$("#post_a_story").click( 
    function(){ 
     $("#new_story_form").dialog("open"); 
    } 
); 

所有版本的Chrome,FF和Safari浏览器的所有功能都完全符合预期。但是,我在IE中遇到了一些不良行为。

假设IE用户在#filter_stories对话框中输入关键字,然后单击enter;会发生什么情况是​​事件侦听器按预期触发,但在它执行触发器的触发器之后,它还会执行click事件侦听器。之前,我使用keyup而不是​​,在这种情况下,当用户单击enter和我的keyup事件侦听器根本没有触发时,神秘地立即触发#post_a_story点击事件。如果我完全删除了post_a_story事件侦听器,则会打开另一个对话框。为什么enter按键会触发不相关的click事件?

请注意,如果用户单击approve_filter_item按钮而不是单击enter,则会按照预期处理该关键字。

+2

您是否有表单元素上的提交事件的任何侦听器?也许这就是触发。按ENTER时是否阻止默认行为? – bfavaretto 2013-05-06 00:20:07

+0

我没有dom中的任何听众,只有在ie中打开对话框。尽管如此,从我的点击事件监听器返回false确实阻止了事件冒泡到ie中一些看不见的监听器。所以,@ bfavaretto,如果你想提交你的评论作为答案,我会很乐意接受它。另外,我很想知道其他人是否注意到这种类型的行为。 – 2013-05-06 23:14:48

回答

0

正如@bfavaretto指出的,.preventDefault()结束了这个奇怪的行为。我不知道为什么它首先发生。