Question

问题：

我需要调用自定义函数ValidateNumericInputBox，它会将焦点返回到文本字段，这将导致无限循环。

我最初有按钮可以执行查找，但在与最终用户一起浏览页面后，它决定在退出文本字段时执行查找/验证。所以我需要找到一种方法来消除由冲突代码创建的无限循环。奇怪的是，这不会发生在Chrome或Firefox中，只有IE。

原始问题：

当我打开一个错误的jquery模式对话框时，IE冻结（无限循环）。在IE开发人员工具中，我可以看到它循环。这在Firefox和Chrome中不会发生。

代码：

$(DivID).dialog({ 
  width:375, 
  height:550, 
  modal:true, 
  closeOnEscape:true,  
  buttons: [ { text: "Ok", click: function() { $( this ).dialog( "close" ); } } ] 
});

关于SO的研究我读到有这条线会有所帮助：

close: function(event,ui){},

添加时仍会出现问题。这是来源：

JQuery dialog freezing on close

显示对话框代码

function DialogBox(Params){ 
 ...
 variables
 ...

 if(arrParams[3])
  errMsg = arrParams[3]; //custom error message

 // CLOSE DIALOG BOX
 if (DivStatus == 'Close'){ 
  $(DivID).hide();
  $(DivID).dialog('close');
 }
 else if(DivStatus === 'Open'){
   ....
   logic for determining err msg
   ....                          

   $(DivID).dialog({ width:375, height:550, modal:false, closeOnEscape:true, focus:    function( event, ui ) {}, buttons: [ { text: "Ok", click: function() { $( this ).dialog( "close" ); } } ] });

}
else{   //  General error message - uncaught error
 if (DivID == '#Div_ErrorMessage')
   {    $(DivID).dialog({ width:375, height:150, modal:true, closeOnEscape:true, close: function(event,ui){},buttons: [ { text: "Ok", click: function() { $( this ).dialog( "close" ); } } ] });    }
 }
}

对话框的HTML DIV

<div id="Div_Wrapper" style="background:#EBEBEB;">
            <div id='Div_LoadingOverlay' class="Div_LoadingOverlay_Relative noPrint"><div class='Div_LoadingOverlay'><br><br><img src='/common/images/misc/loader_01.gif' align='absmiddle' /><br>Loading...</div></div>
            <div id='Div_ErrorMessage' style='display:none;' title='Error Message'>There seems to be something wrong with the form...</div>

研究

JQuery dialog freezing on close

jquery Ui-dialog and ie8

我研究过的很多问题都是＆lt; = 2010，并处理我不支持的浏览器。也不完全相关。

测试浏览器

IE 9,10 - 无效

Firefox 18.0.1 - 正常工作

Chrome版本34.0.1847.137 m - 有效

更多测试用例：

1）在点击功能中删除了$( this ).dialog( "close" );。 - 不起作用。

2）将内容带回基础，直接从jquery的网站复制并粘贴代码

$( "#dialog-modal" ).dialog({
      height: 140,
      modal: true
    });

将课程#dialog-modal更改为DivId。 - 这不起作用。

编辑0

我刚刚意识到这将是有用的信息并且是问题的一部分。我在onBlur事件的文本字段上执行验证。因此，每当用户退出文本字段时，都会执行验证，如果输入无效，则会出现此对话框。所以我认为在弹出这个对话框之后会发生这种情况，它会将焦点返回到文本框，然后焦点返回到创建这个无限循环的对话框。

编辑1

正是如此，但这是因为我的代码将焦点返回到文本字段以将文本字段概述为红色。这些是用户要求，我无法更改它们。

调用此函数以查找信息并验证字段。如果从JSP页面返回错误，则

function someFuncNameLookup(params){
....
//SubmitForm =  ValidateNumericInputBox('#'+ arrParams[0] +' #'+orgType+'^5^0');
// SUBMIT FORM
//if (SubmitForm.length == 0){
if (0 == 0){
 $('#Div_LoadingOverlay').show();
 $.post("/someDirectory/someFileName.jsp", 
   { ID20140411: "LookUp_org|"+ $("#"+orgType).val() + '|' + orgType }, 
    function(ID20140411_LoadDefault_data) { 
       var splitData = ID20140411_LoadDefault_data.split("%");
       var splitString = splitData[1].toString();
       var pairs = splitString.split(",");                                                      if(ID20140411_LoadDefault_data.search('orgLookupError') != -1){
     DialogBox('Div_ErrorMessage^Open^orgLookupError');
     }else{
       displayLookupData(pairs,lookupType);
     }
 });  
}else{
   DialogBox('Div_ErrorMessage^Open^orgLookupError');
}
$('#Div_LoadingOverlay').hide();
}

ValidateNumericInputBox会将焦点返回到有错误的文本字段。这是我“需要”使用的公司另一组代码库的一部分。我更改if(0==0)以确认ValidateNumericInputBox是我的问题的原因。当我if(0==0)时，我没有得到无限循环。奇怪的是，这只发生在IE中。

无限循环中的Jquery Modal UI对话框 - 仅在IE中

0 个答案: