Question

我一直在搜索Stack Overflow超过一个小时，似乎无法找到解决这个问题的方法。为了减少这个PHP页面的加载时间，我试图将其他页面的内容放入div。

页面查询正确，我可以在Safari（Inspector）和FireBug中看到输出。

success: function(output_string)内的内容无法加载。我尝试了所有可能的组合。我也试过var self = this;没有运气，虽然我认为这可能是由于jQuery(document).ready(function() {但我使用的是两个版本的jQuery。

这是我的附加代码：

<script type="text/javascript">

jQuery(document).ready(function() {
  jQuery(".text").hide();
  //toggle the component with class msg_body
  jQuery(".ttop2").click(function() {
    jQuery(this).next(".text").slideToggle(500);

    var expanded = "./expand.png";
    var collapsed = "./collapse.png";
    var src = $(this).find(".toggle").attr('src');

<? if($show == 'off') { ?>

    if (src == expanded){
      $(this).find(".toggle").attr('src',collapsed);
      var office = $(this).attr("id");
      var month = "<? echo $month; ?>";
      var year = "<? echo $year; ?>";
      $(this).closest(".loading").html("Loading...");
      alert(office);

      $.ajax({
        url: 'LTData.php',
        type:'POST',
        data: 'office=' + office + '&month=' + month + '&year=' + year,
        dataType: 'json',
        success: function(output_string){
            $(this).find(".loading").html("");
            $(this).find(".text").html(output_string);
        } // End of success function of ajax form
      }); // End of ajax call 

    } else {
      $(this).find(".toggle").attr('src',expanded);
      var office = $(this).attr("id");
      alert(office);
    }

  });
});

<? } else {
//..... Etc.
 ?>

P.S：我今天开始编写Javascript，所以我会喜欢一些关键的回复。谢谢！

编辑：脚本在头脑中。

编辑2：附加HTML / PHP。

    $sqlb="SELECT * FROM league ORDER by total DESC"; 
    $resultb=mysql_query($sqlb);
    $num=mysql_num_rows($resultb);
    while($rowsb=mysql_fetch_array($resultb)){

    if($rowsb[total] == '0') {
        continue;
    }


if($col=='ebdff2'){

$col='efefef';

}else{

$col='ebdff2';

}
?>

<table class="ttop2" id="<? echo $rowsb["office"]; ?>" bgcolor="#<? echo $col;?>" width="100%">
    <tr>
        <td width="50%" align="left"><b style="text-transform: capitalize; color:rgb(98, 188, 70);"><? echo $rowsb[office];?></b></td>
        <td width="20%" align="left"><b style="text-transform: capitalize; color:rgb(98, 188, 70);"><? echo $rowsb[leads];?></b></td>
        <!-- <td width="200px" align="left">Total leads</td>
        <td width="270px" align="left">Leads converted</td>-->
        <td width="20%" align="left"><b style="text-transform: capitalize; color:rgb(98, 188, 70);"><? echo $rowsb[total];?></b></td>
        <td width="10%" align="left"><img style="float: right;" class="toggle" alt="" src="./expand.png" /></td>
    </tr>
</table>

<div class="text"><div class="loading"></div></div>

<? } ?>

<?
}///end of show what...
?>

Answer 1

在ajax成功函数中，您将失去this引用。您需要在函数之前缓存它：

var $this = $(this); //Here
$.ajax({
    url: 'LTData.php',
    type:'POST',
    data: 'office=' + office + '&month=' + month + '&year=' + year,
    dataType: 'json',
    success: function(output_string){
        $this.find(".loading").html("");
        $this.find(".text").html(output_string);
    } // End of success function of ajax form
}); // End of ajax call

或者，正如Kevin B所说，在上下文选项中传递它：

$.ajax({
    url: 'LTData.php',
    type:'POST',
    data: 'office=' + office + '&month=' + month + '&year=' + year,
    dataType: 'json',
    context : this,
    success: function(output_string){
        $(this).find(".loading").html("");
        $(this).find(".text").html(output_string);
    } // End of success function of ajax form
}); // End of ajax call

Answer 2

之后

 jQuery(".ttop2").click(function() {

做

var parent = $(this);

并将所有对$（this）的调用替换为parent。使用$（this）时遇到很多机箱问题，请先解决这个问题，并告诉我们是否有帮助。

Answer 3

以下代码需要在成功事件下编写，其中response是html中返回的数据。

//use filter to find an element is at the root level of response.

  if ($(response).filter('#Display').length > 0) { }

//use find to search an element is not at the root level of response.

  if ($(response).find('#AddNew').length > 0) { }

$（this）.find（“。text”）和（“.loading”）在AJAX成功函数内部无效

3 个答案: