如何使用 jquery 通过 ajax 使用加载器和 html 内容答案

【问题标题】：how to use loader and html content via ajax using jquery如何使用 jquery 通过 ajax 使用加载器和 html 内容
【发布时间】：2012-01-18 12:34:09
【问题描述】：

这是我的代码

   $('#loader').hide()
   .ajaxStart(function(){
     $(this).show();
   })
   .ajaxStop(function(){
     $(this).hide();
   });


   $('form#jobsearch').submit(function(){
      $("div.job-search-content").hide();
      $("div#pagination").hide();

       $.ajax({
          type: "POST",
          url: "classes/ajax.simplesearch.php",
          data: $('form#jobsearch').serialize(),
          success: function(data){
          // I DONT" REALLY KNOW WHAT TO DO IN THIS PART 
            $(data).insertAfter('#job-search-headings').html();
              //$("div.job-search-content").show();
          }
       });
        return false;
   });
});

如果我隐藏 job-search-content div，它将显示加载程序但问题是，我将如何将检索到的数据库内容添加到 '#job-search-headings' div ? ....我签入了萤火虫..我能够检索到正确的数据..但我无法在前端显示它:(

【问题讨论】：

标签： php jquery html ajax

【解决方案1】：

如果你想在 div "job-search-content" 上显示 ajax 结果

$("div.job-search-content").html(data).show();

【讨论】：

【解决方案2】：

data 是您发布到的页面的响应，因此如果页面返回类似<div>some content</div> 的内容改变

$(data).insertAfter('#job-search-headings').html();

到

$('#job-search-headings').after(data);

【讨论】：

【解决方案3】：

试试这样的：

$('#job-search-headings').after(data);

【讨论】：

应该可以工作，您可能在 .hide() 或 display: none 上有一个包含数据的 DIV。
如何使加载器停留更长时间？..我的意思是，它太快了..就像，我想向最终用户展示它当前正在加载数据，即使它只是在尝试只获取 1 个数据.. 我只想让加载程序显示大约 5 秒或更短时间？