首次显示后 JQuery 对话框不起作用

Posted 2023-05-08

【中文标题】首次显示后 JQuery 对话框不起作用

【英文标题】：JQuery dialog not working after first show

【发布时间】：2016-02-08 10:00:36

【问题描述】：

我在我的项目中使用 JQuery 对话框向用户显示餐厅菜单。 当用户设置食物数量时，它也会显示订单价格。所有这一切都发生在对话中。所以用户接受它的订单并提交它。订单表单位于另一个 php 文件中，该文件呈现为 json 并传递给包含对话框的 div。第一次一切都很好。但如果用户想提交另一个订单，则没有任何效果。不是 ajax 不提交表单或其他任何东西，用户必须重新加载页面到对话框再次正常工作。 这是我的对话代码：

$('#dialog-modal').dialog(
      autoOpen: false,
      resizable: false,
      width:900,
      height:500,
      hide: function () 
        $(this).fadeOut();
      ,
      show:  function () 
        $(this).fadeIn();
      ,
      open: function() 
        $('#dialog-modal').empty();
        $.ajax('<?php echo url()?>/admin/preload',
          dataType:'json',
          cache: false,
          success:function(data)
            $('#dialog-modal').html(data.content);
          
        );
      
    );

open 函数中的 ajax 正在加载餐厅的菜单。 这是我的提交按钮。有两个提交按钮。一个用于提交并关闭对话框，另一个用于提交并打开另一个对话框进行提交。

 $('#submit').on('click',function()
  var data = $('#form').serialize();
  $.post('<?php echo url()?>/admin/add-food',data);
  $('#dialog-modal').dialog('close');
);
$('#newSubmit').on('click',function()
  var data = $('#form').serialize();
  $.post('<?php echo url()?>/admin/add-food',data);
  $('#dialog-modal').dialog('close');
  $('#dialog-modal').dialog('open');
);

编辑： 如果我在关闭功能中销毁对话框，它在所有情况下都可以正常工作，但在提交和新建按钮中，它关闭对话框并且不打开新对话框

【问题讨论】：

我认为这条线是你问题的原因$('#dialog-modal').empty();

感谢您的回答，但仍然无法正常工作

您是否在控制台中遇到任何错误？

"但是如果用户想提交另一个订单，则没有任何效果。不是 ajax 不提交表单或其他任何东西"向我们展示你的提交功能，也许你应该只做$(document).on('click','element',function());，因为你有一些动态按钮

【参考方案1】：

我认为，可能是您的按钮动态呈现。所以我们需要向该按钮添加事件监听器。试试下面的代码。

$(document).on('click','#submit',function()
  var data = $('#form').serialize();
  $.post('<?php echo url()?>/admin/add-food',data);
  $('#dialog-modal').dialog('close');
);
$(document).on('click','#newSubmit',function()
  var data = $('#form').serialize();
  $.post('<?php echo url()?>/admin/add-food',data);
  $('#dialog-modal').dialog('close');
  $('#dialog-modal').dialog('open');
);

【讨论】：

你有fiddler或网站网址吗？