javascript - Click event is opening the wrong dialog in IE -


i have website has several buttons open different jquery ui dialog boxes.

inside 1 of dialogs (with id of filter_story) text field in user can type in keywords use later filter stories when polling server. have text field set-up user can enter several keywords, clicking button of class approve_filter_item after entering each item, or user can click enter button between each keyword.

// button open keyword filter list $( "#filter_stories" ).click(      function(){        $( "#filter_dialog" ).dialog( "open" );      } );  $(".approve_filter_item").click(function(){   [process inserted keyword , put focus on textfield] });  //listen enter key when user's focus on entering new keyword $(".new_filter_item").keydown(function (e) {   if (e.keycode == 13) {     $($(this).parents("tr")[0]).find(".approve_filter_item").click();   } });  // button show post story dialog form $( "#post_a_story" ).click(      function(){       $( "#new_story_form" ).dialog( "open" );     } ); 

everything works expected in versions of chrome, ff , safari. i'm experiencing bad behavior, however, in ie.

say ie user enters keyword in #filter_stories dialog, , clicks enter; happens keydown event listener triggers expected, after executes click event listener #post_a_story triggers. previously, used keyup instead of keydown, , in case #post_a_story click-event mysteriously triggered when user clicked enter, , keyup event listener never triggered @ all. if remove post_a_story event listener altogether, 1 of dialog boxes opens instead. why enter key press triggering unrelated click events?

note if user clicks approve_filter_item button instead of clicking enter, keyword processed expected.

as @bfavaretto pointed out, .preventdefault() put end weird ie behavior. have no idea why happened in first place.


Comments