5

我有一个 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();
            });
        }
    });
});

当结果返回时,它会显示正确的更改并替换表单。但是,当我再次发布表格时。相关更改按原样进行,但随后也会刷新页面并在地址栏中显示发布的信息

我如何发布表单并替换它以允许它再次发布和调用脚本而不会发生这种情况?

4

1 回答 1

3

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

基本上,每次你传回一个新表单时,你都会传回下面的代码。您需要更新IDs 和链接 (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>
于 2013-01-27T15:03:29.537 回答