0

我有一个包含下拉列表选项、一个输入框和一个提交按钮的表单。选择选项是动态编译的。我通过插入将此表格放在我的页面上；

<div id="dropdown">
       <?php include("./listforward.php"); ?>
</div>

listforward.php 包含；

...
<form id="changeforwardForm" method="post" action="changeforward.php" class="ajaxform">
...
</form>

changeforward.php 做了一些工作并给出了一条消息；

<?php echo '<div style="color:red">'.$msg.'</div>'; ?>

提交后，此消息显示在页面顶部附近

<div id="testDiv"></div>

并且，整个表单被重新加载以显示更新的列表选项。我遇到的问题是该消息仅在第一次提交的顶部显示一次，而在第二次提交时，它会打开一个空白页面并在那里显示。

我知道这与 .live() 或 .on() 有关，但对于我的生活，我无法弄清楚如何应用它。

我的外部 Javascript 文件

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.form.js"></script>

jQuery 表单插件

<script type="text/javascript"> 
  // prepare the form when the DOM is ready 
  $(document).ready(function(){ 
      var options = { 
          target:        '#testDiv',   // target element(s) to be updated with server response 
          success:       showResponse  // post-submit callback 
  }; 

  // bind form using 'ajaxForm' 

  $('.ajaxform').ajaxForm(options);          

  });         


  // post-submit callback 
  function showResponse(responseText, statusText, xhr, $form)  { 

     $("#dropdown").load("index.php #dropdown");

       }  
</script>

我在同一页面上还有另一个表单（目前已禁用）。我想定位此表单的输出并让它在#testDiv 中显示其消息。

任何朝着正确方向的踢都将不胜感激！

问候史蒂文

4

1 回答 1

0

您没有显示所有代码，但据我所知，您使用的是：

$('.ajaxform').ajaxForm(options);          

  });

将您的功能附加到来自提交。然后正如您所说，您重新加载表单，以便不再附加该功能。然后当您重新提交时，它的行为就像常规提交一样。

您应该在重新加载后将您的方法重新附加到表单，即再次运行它：

$('.ajaxform').ajaxForm(options);          

      });
于 2012-02-08T06:50:31.053 回答