在 pjax 请求上显示加载文本答案

【问题标题】：show loading text on pjax request在 pjax 请求上显示加载文本
【发布时间】：2013-09-10 06:55:24
【问题描述】：

我有一个使用 pjax 加载页面的脚本。我想在发出请求时显示加载“正在加载...”文本，并显示直到页面完全加载。当ajax调用时...

        pjax.connect({
        'container': 'pageContent',
        'beforeSend': function(){console.log("before send");},
        'complete': function(){console.log("done!");}
    });

在萤火虫控制台中发送此消息。所以我在想也许，使用 beforesend 和 complete 功能是可行的。我对javascript知之甚少，所以也许你们中的一些人可以告诉我如何做到这一点。

【问题讨论】：

标签： javascript jquery ajax loading show-hide

【解决方案1】：

你是对的 - 你可以使用 'beforeSend' 来显示 'Loading...' 消息，并使用 'complete' 事件来移除它：

  pjax.connect({
    'container': 'pageContent',
    'beforeSend': function(){ $('#LoadingMSG').show(); },
    'complete': function(){ $('#LoadingMSG').hide();}
  });

这假设您有一个 ID 设置为 LoadingMSG 的元素：

<div id='LoadingMSG'>Loading...</div>

希望这会有所帮助！

【讨论】：

老兄谢谢。我用你的代码更新了代码，并在开始时添加了隐藏选项，这样它就不会在开始时显示，只在 pjax 调用时显示。 :) <script type='text/javascript'> $(document).ready(function() { $('#loading') .hide() }); //PJAX links! pjax.connect({ 'container': 'pageContent', 'beforeSend': function(){ $('#loading').show(); }, 'complete': function(){ $('#loading').hide();} }); //pjax.connect('pageContent', 'pjaxer'); //pjax.connect('pageContent'); //pjax.connect(); </script>
很高兴能帮上忙 (-!

【解决方案2】：

   <div id='main'>
     <div class='loader' style='display:none'><img src='spin.gif'></div>
     <div class='tabs'>
       <a href='/explore'>Explore</a>
       <a href='/help'>Help</a>
     </div>
   </div>


   $('a').pjax('#main').live('click', function(){
     $(this).showLoader()
   })

【讨论】：

未捕获的类型错误：$(...).pjax(...).live 不是函数