javascript pjax 仍然会重新加载整页
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12004564/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
pjax still does full page reload
提问by Chris Mccabe
I have tried pjax examples in chrome and firefox, i took the sample code and placed it into my own app but it still does a full page reload. The AJAX request happens then the page moves on without updating the #main div
我已经在 chrome 和 firefox 中尝试过 pjax 示例,我将示例代码放入我自己的应用程序中,但它仍然会重新加载整个页面。AJAX 请求发生,然后页面继续移动而不更新 #main div
<html>
<head>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.0/jquery-1.8.0.min.js"></script>
<script src="http://localhost:8888/jul/js/jquery.pjax.js"></script>
<script type="text/javascript">
// $(document).ready(function(){
// $('a[data-pjax]').pjax();
// })
// $(document).ready(function(){
// $('a').pjax({
// container: '#main'
// })
$('document').ready(function(){
$('ul a').pjax('#main')
});
</script>
</head>
<body>
11:59:36 <div id="main">
<div class='loader' style='display:none'><img src='http://localhost:8888/jul/imgs/spinner.gif'></div><ul>
<li><a data-pjax='#main' href="/jul/stats/pjax_stats/index/">Index</a></li>
<li><a data-pjax='#main' href="/jul/stats/pjax_stats/total_posts/">total_posts</a></li>
<li><a data-pjax='#main' href="http://localhost:8888/jul/stats/pjax_stats/index">Index</a></li>
<li><a data-pjax='#main' href="http://localhost:8888/jul/stats/pjax_stats/total_posts">total_posts</a></li>
<li><a href="http://localhost:8888/jul/stats/pjax_stats/total_graph">total_graph</a></li>
<li><a href="http://localhost:8888/jul/stats/pjax_stats/twitter_graph">twitter_graph</a></li>
<li><a href="http://localhost:8888/jul/stats/pjax_stats/facebook_graph">facebook_graph</a></li>
</ul>index files
</div>
</body>
</html>
I have tried multiple methods to invoke pjax and maybe someone else could point out where i am going wrong? The Ajax/GET seems to return fine in firebug console- this is an example of my php that produces the pjax response
我尝试了多种方法来调用 pjax,也许其他人可以指出我哪里出错了?Ajax/GET 似乎在 firebug 控制台中返回正常 - 这是我的 php 生成 pjax 响应的示例
public function total_posts(){
// print_r($_SERVER);
if (!isset($_SERVER["X_PJAX"])) {
$this->load->view('stats/pjax_stats/header');
$this->load->view('stats/pjax_stats/links');
}else{
echo "pjax";//add in for debug
}
echo "total posts";
if (!isset($_SERVER['X-PJAX'])) {
$this->load->view('stats/pjax_stats/footer');
}
}
A bug?
一个错误?
There seems to be a bug in the latest version where the append variable to the end of the url where the ajax request is made to is _pjax=container instead of _pjax=true
最新版本中似乎存在一个错误,其中将 append 变量添加到 ajax 请求的 url 末尾是 _pjax=container 而不是 _pjax=true
回答by Laurens
Have you tried setting the timeout higher (default < 1s )?
您是否尝试将超时设置得更高(默认 < 1s )?
For example:
例如:
$('document').ready(function(){
$('ul a').pjax({
container: '#main',
timeout: 5000 #ms
});
});
回答by Sammaye
I thought I would add an answer since I got this problem today and this was the first Google result.
我想我会添加一个答案,因为我今天遇到了这个问题,这是第一个谷歌结果。
Before you go changing the timeout make sure your container exists. This may sound obvious but if your using a framework, say Yii2 (PHP), you will find that your container ID may no longer exist between refreshes, hence pjax is refreshing the whole page.
在更改超时之前,请确保您的容器存在。这听起来很明显,但是如果您使用框架,比如 Yii2 (PHP),您会发现您的容器 ID 在刷新之间可能不再存在,因此 pjax 正在刷新整个页面。
So as a note: make sure your container exists before you tweak with timeouts.
因此请注意:在调整超时之前,请确保您的容器存在。