Jquery / ajax回调不会触发两次而不重新加载页面.第1部分 - jquery/ ajax callback doesn't fire twice without a page reload. Part 1

jquery/ ajax callback doesn't fire twice without a page reload. Part 1

我正在学习如何应用ajax到我的jquery/php/mysql脚本回调触发的目的。这个问题可能是由于我不知道这个术语的名称。

问题:有没有一种方法来重置ajax回调而不重新加载页面脚本。

目标:我有一个mysql查询显示在jQuery Accordian 1, 2和3。目标是单击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>";    
}

ID为'submit'的元素是否在ID为'stage'的元素中?如果是，尝试将$("#submit").click(function(){更改为$("#submit").live('click', function(){。

这个问题可能是因为你的提交按钮在'stage'div里面。这意味着当你加载新的'stage'内容时，它会删除旧的按钮并添加一个新的，新的按钮不会有任何点击的东西。

这个问题的快速解决方法是使用一个'live'处理程序。

$(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();
});

但另一个解决方案，可能使问题更清楚，是在加载完成后重新添加click处理程序。

$(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();
});