这件事害了我两天
我有这个简单的代码:
<?php if(!isset($_GET['headerload'])){?>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://royta.ir/js/all.js" type="text/javascript"></script>
<script src="http://royta.ir/js/main.js'?>"></script>
<div id="content">
<? } ?>
<a class="item ajax" base="basic" data-title="تنظیمات عمومی" href="http://royta.ir/general/" data-url="/general/" title="تنظیمات عمومی" >asdasd</a>
还有这个jquery
$(function() {
$('a.ajax').click(function(eee){
eee.preventDefault();
var location = $(this).attr('href') + '&headerload';
var base = $(this).attr('base');
var id = $(this).attr('data-id');
var titlepage = $(this).attr('data-title');
var url = $(this).attr('data-url');
$('#content').html('');
$('#content').empty();
//change title
$.ajax({url:location,success:function(loaddataa){
document.title = titlepage;
window.history.pushState(null, titlepage, url);
$('#content').html(loaddataa);
}
});
});
})
但是当我运行此页面 http://royta.ir/general如你所见
它仅使用 ajax 运行 1 次,一切正常,但如果您再次单击链接页面将重新加载
有人知道为什么吗?
最佳答案
你会看到...当你运行$('#content').html(loaddataa);
时,一个新的<a />
已加载到页面上,因此您绑定(bind)到该元素的事件 ( $('a.ajax').click
) 不再存在。
如果您确实希望页面像有效的 HTML 页面一样继续工作,请尝试替换
$('a.ajax').click(function(eee){
与
$('a.ajax').on('click', function(eee){
它绑定(bind)到将来创建的元素。
关于ajax 第一次加载页面时起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17870792/