如果不重新加载页面，jquery/ajax 回调不会触发两次。第 1 部分

Question

我正在学习如何将 ajax 应用到我的 jquery/php/mysql 脚本中以实现回调触发。这个问题可能是因为我对这个术语的名称的无知。

问题：有没有办法在不重新加载页面脚本的情况下重置ajax回调。

目标：我有一个在 jQuery Accordian 1、2 和 3 上显示的 mysql 查询。目标是单击 Accordian 中的查询结果 href 并在 jQuery UI Tab 3 中显示结果，而无需重新加载页面...到目前为止，脚本在我的第一次回调时触发，但不会第二次触发。是否有术语或 jquery 命令可以重置 jquery/ajax？

index.php

<?php 
...script... include'right.content.php';
?> 

<script type="text/javascript" >
$(function() {
$("#submit").click(function(){   // when submitted 
  var name = $('#string2').val();
  var lname = $('#string3').val(); //  // POST name to php
  $('#stage').load('test.arena/test.php', {'string2':name, 'string3':lname,} ); 
});
$( "#tabs" ).tabs().find( ".ui-tabs-nav" ); 
$( "#accordion" ).accordion();
});
</script>

index.php - html 部分

   <div id="stage">
        <?php include'test.arena/test.php';?>
   </div>

right.content.php

while ($row = mysql_fetch_array($result)){      
  if($row['stats'] == "1"){
$data .= "<tr><td colspan='2'>".$row['order_number']."</td> 
<td colspan='2'>
<input type='hidden' id='string3' value='".$row['details']."'>
<input type='hidden' id='string2' value='".$row['order_number']."'>
<input type='button' id='submit' value='View'></td>
<td>info</td></tr>";

test.arena/test.php

if(!isset($_POST['string2'])){
$_POST['string2'] = "";

}else{

$string3 = "PO Number:" .$_POST['string3']; 
$string2 = "Order:" .$_POST['string2'];
echo $string3 ."</br>";
echo $string2 ."</br>";    
}

Answer 1

ID 为“submit”的元素是否位于 ID 为“stage”的元素内？如果是这样，请尝试将 $("#submit").click(function(){ 更改为 $("#submit").live('click', function(){.

Answer 2

问题可能是因为您的提交按钮位于“stage”div 内。这意味着当您加载新的“舞台”内容时，它将删除旧按钮并添加一个新按钮，并且新按钮不会附加任何点击内容。

解决此问题的快速方法是使用“实时”处理程序。

$(function() {
  $("#submit").live('click', function(){   // when submitted 
        var name = $('#string2').val();
        var lname = $('#string3').val(); //  // POST name to php
        $('#stage').load('test.arena/test.php', {'string2':name, 'string3':lname,} );
  });

  $( "#tabs" ).tabs().find( ".ui-tabs-nav" ); 
  $( "#accordion" ).accordion();
});

但另一个解决方案可能会使问题更加清晰，那就是在加载完成后重新添加单击处理程序。

$(function() {

  function submitClicked() {
    var name = $('#string2').val();
    var lname = $('#string3').val(); //  // POST name to php
    $('#stage').load(
      'test.arena/test.php', 
      { 'string2':name, 'string3':lname },
      function() {
        addClickHandler();
      }
    ); // display results from test.php into #stage 
  }

  function addClickHandler() {
    $('#submit').click(submitClicked);
  }

  addClickHandler();
  $( "#tabs" ).tabs().find( ".ui-tabs-nav" ); 
  $( "#accordion" ).accordion();
});