表单提交上的 Jquery Ui 对话框答案

【问题标题】：Jquery Ui dialog on form submit表单提交上的 Jquery Ui 对话框
【发布时间】：2015-06-15 14:39:55
【问题描述】：

我试图阻止 jquery ui 对话框在表单提交满足 1 个条件后弹出。我正在寻找每个事件一个对话框。满足条件就休息一下。目前所有对话框都在一个关闭后出现。我试过 stopPropagation 和 stopImmediatePropagation 没有效果。我的代码如下：

    $('#myForm').on('submit',function(e){
     if ($("#tramA").is(':checked') && !$('.tramAChecked:checked').length) {
                   $( "#tramA-message" ).dialog({
                    modal: true,
      draggable: false,
      resizable: false,
      buttons: {
        Ok: function() {
          $( this ).dialog( "close" );
        }
      }
});
e.preventDefault();
}

     if ($("#tramB").is(':checked') && !$('.tramBChecked:checked').length) {
     $( "#tramB-message" ).dialog({
                    modal: true,
      draggable: false,
      resizable: false,
      buttons: {
        Ok: function() {
          $( this ).dialog( "close" );
        }
      }
 });
e.preventDefault();
} 
});

HTML：

<div id="tramB-message" title="Warning">
  <p>
    <span class="ui-icon ui-icon-alert" style="float:left; margin:3px 7px 50px 0;"></span>
    You selected "Tram B hall" but did not select a tram option!
  </p>
  </div>
  <div id="tramA-message" title="Warning">
  <p>
    <span class="ui-icon ui-icon-alert" style="float:left; margin:3px 7px 50px 0;"></span>
    You selected "Tram A hall" but did not select a tram option!
  </p>
  </div>

【问题讨论】：

我不明白你的 .each() 循环。他们只是每次都检查同样的事情，而不是对 i 或 this 做任何事情。
您不需要在事件处理程序中使用$(function ...)。这只需要包裹在顶层 jQuery 代码中。
如果您只想显示一次对话框，请将循环外的变量设置为true。在显示对话框之前，请检查它是否已设置。如果是，则显示对话框并将变量设置为 false。
另外，如果你从 .each() 函数中 return false，这将阻止它循环。
我不必遍历所有复选框以查看它们的状态是什么来触发该功能吗？使用每个

标签： jquery forms user-interface submit jquery-ui-dialog

【解决方案1】：

改变 e.preventDefault();返回错误；成功了。

【讨论】：