Question

我设置了一个带有表单的div，并设置为使用ajax发布并将结果返回到div中

$(document).ready(function(){
    $("#guestList").validate({
        debug: false,
        submitHandler: function(form) {
            // do other stuff for a valid form
            //$('form').attr('id', 'guestList1')
            $.post('brides_Includes/guestlistDisplay1.php', $("#guestList").serialize(), function(data) {
                $('#results').html(data)
                $("form#guestList")[0].reset();
            });
        }
    });
});

当结果返回时，它会显示正确的更改并替换表单。但是，当我再次发布表格时。相关的更改会按照应有的方式进行，但它也会刷新页面并在地址栏中显示已发布的信息

如何发布表单并替换它，以便在不发生这种情况的情况下再次发布和调用脚本？

Answer 1

使用ajax返回表单的问题是页面上已有的任何JavaScrip代码都不会看到/利用新表单。解决这个问题的最佳方法是使用ajax传回JavaScrip和HTML。

每次传回新表单时，基本上都会传回以下代码。您需要更新ID和链接（brides_Includes / guestlistDisplay1.php）。您还需要使用此代码替换主页上的代码，因为执行传回的任何JavaScrip都需要这样做。

<script type="text/javascript">
$(document).ready(function(){
  $("#guestList").validate({
    debug: false,
    submitHandler: function(form) {
      // do other stuff for a valid form
      //$('form').attr('id', 'guestList1')
      $.post('brides_Includes/guestlistDisplay1.php', $("#guestList").serialize(), function(data) {
        $('#results').html(data);

        //This executes the JavaScript passed back by the ajax.
        $("#results").find("script").each(function(i) {
          eval($(this).text());
        });

        $("form#guestList")[0].reset();
      });
    }
  });
});
</script>

使用Ajax提交表单

1 个答案: