jquery对话框关闭IE

Question

我使用对话框作为搜索区域。用户点击添加图标，对话框弹出文本框和小搜索图标。当在文本框中点击搜索图标或按下输入时，我想开始搜索。

在FF 19中完美工作，但在IE 9中，当我按下Enter按钮时，对话框关闭。 我测试了一个独立的HTML页面，简单的对话框，文本框和IE 9工作正常。 因此，我的代码中有东西触发IE 9关闭对话框。

我在对话框上没有form。它会对结果进行AJAX调用，当返回结果时，对话框上会出现一个“添加”按钮，通过复选框将选定结果添加到主页面下方的列表框中。

我已经阅读了一堆关于堆栈溢出问题的一个按钮被绑定到输入按钮等对话框，所以我删除了“添加”按钮。我也删除了文本框的.keypress代码（即关闭搜索AJAX函数），但仍然在按下输入按钮对话框时关闭。

我在对话框中做了一个beforeClose: function(event, ui)，并提醒一些事件信息，当警报框打开时，我看到对话框上的close button (x)有焦点。

我会如何追溯什么是触发关闭按钮时，我按下输入？我试图在IE调试器，beforeClose和beforeClose函数中放置断点，但IE不会在那里破坏。我不能在FF中重新创建问题，它具有更好的调试器。下面我的代码

片段：

$('#dialog_add_assign_to').dialog({ 
     autoOpen: false, 
     closeOnEscape: false, 
     /*open: function(event, ui) { $(".ui-dialog-titlebar-close", $(this).parent()).hide(); },*/ 

     modal: true, 
     resizable: true, 
     minWidth: 600, 
     buttons: { 
      "Add": function() { 
       $('.dialog_add_assign_to_result_checkboxes').each(function() { 
        if ($(this).is(':checked')) { 
         $('#' + $('#dialog_add_assign_to').data("type") + '_id').append('<option value="' + $(this).attr('id') + '">' + $(this).attr('ref_name') + ' (' + $(this).attr('ref_country') + ')</option>'); 
        } 
       }); 
      }, 
      "cancel": function() { 
       $(this).dialog("close"); 
      } 
     }, 
     beforeClose: function(event, ui) { 
      $('#dialog_add_assign_to_result > tbody:last').empty(); 
      alert(event.originalEvent.originalEvent ); 
      event.preventDefault(); 
     } 
    }); 


    //When user presses enter, fire off the search function (search icon click) 
    $("#txt_search").keypress(function(e) { 
     if (e.keyCode == $.ui.keyCode.ENTER) { 
       $("#search_assigned_to").click(); 
     } 
    }); 

    //Click on the icon to start AJAX search call 
    $("#search_assigned_to").click(function() {   
     $('#dialog_add_assign_to_result > tbody:last').empty(); 

     $.ajax({ 
      type :'GET', 
      url : 'get_ajax_data.php?type=search_' + $('#dialog_add_assign_to').data("type") + '&search_text=' + $("#txt_search").val(), 
      dataType : 'xml', 
      success : function(xml_results) { 
       $('#dialog_add_assign_to_result > tbody:last').append('<tr><td><?=_NAME?></td><td><?=_COUNTRY?></td><td></td></tr>'); 
       console.log(xml_results); 
       $(xml_results).find('search_' + $('#dialog_add_assign_to').data("type")).each(function(){ 
        var int_id = $(this).find("id").text(); 
        var str_name = $(this).find("name").text(); 
        var str_country = $(this).find("country_name").text(); 

        if (int_id == '----') { 
         var str_tmp = ''; 
        } else { 
         var str_tmp = '<input type="checkbox" class="dialog_add_assign_to_result_checkboxes" ref_name="' + str_name + '" ref_country="' + str_country + '" id="' + int_id + '" />'; 
        } 

        $('#dialog_add_assign_to_result > tbody:last').append('<tr><td>' + str_name + '</td><td>' + str_country + '</td><td>' + str_tmp + '</td></tr>'); 
       }); 

      } 
     }); 
    }); 

对话框HTML：

<div id="dialog_add_assign_to"> 
    <input type="text" id="txt_search" name="txt_search" /><img class="img_16" id="search_assigned_to" src="/images/tray/magnify.gif" /> 
    <table id="dialog_add_assign_to_result"><tbody></tbody></table> 
</div> 

Answer 1

首先，你可以尝试 “event.preventDefault（）;”在“beforeClose”函数中查看是否停止了关闭。在使用chromes调试器检查“beforeClose”函数中的“event.originalEvent.originalEvent”时，我看到当我使用“Esc”键时，它添加了“keyCode”属性“27”和“type”属性“keydown” 。当你点击右上角的“x”时，它会添加一个“类型”属性“click”，它会告诉你“srcElement”是什么，显然它是一个mouseevent。

我建议你看看那里的线索，应该告诉你到底什么是关闭对话框。你提到IE在“beforeClose”事件中没有中断？你可以登录来控制该事件的任何数据或做任何警报？