这是我的功能:
$(".link").click(function(event){
event.preventDefault();
event.stopPropagation();
pageLoad = $(this).data('page');
$('div#loading').fadeIn();
$('div#content').load('pages/'+pageLoad);
});
我的页面上有一个带有 id 内容的 div,它显示了被调用的页面,但是它似乎加载了两次页面。我知道这一点是因为其中一个页面以打乱的顺序显示某些内容,并且我可以看到它加载了两次。有趣的是,当我添加时它工作正常
throw new Error('something here');
到函数的末尾,如下所示:
// LINK CLICK
$(".link").click(function(event){
event.preventDefault();
event.stopPropagation();
pageLoad = $(this).data('page');
$('div#loading').fadeIn();
$('div#content').load('pages/'+pageLoad);
throw new Error('bla bla');
});
但其他任何事情都会导致它触发两次。我尝试重新安排事情等等,但它仍然存在。我使用此功能的链接很简单:
<a href="#" class="link" data-page="whatever.php">link</a>
只有一个 jQuery 1.7.2 实例被调用。我不知道该怎么做。我还尝试了 live() 和 on() 函数并体验了完全相同的结果。
!!!编辑 !!!
$(".link").click(function(event){
event.preventDefault();
event.stopPropagation();
pageLoad = $(this).data('page');
console.log('clicked');
$('div#loading').fadeIn(function() {
console.log('faded');
$('div#content').load('pages/'+pageLoad+'.php', function() {
console.log('loaded');
});
});
});
现在......这就是真正有趣的地方。我没有更改我的链接之一
data-page="page.php"
只是
data-page="page"
(因为 .php 现在直接包含在函数中)
当我单击任何应该按预期工作的链接时,我会被加载、单击,然后在我的错误控制台中消失。每人只有一个。页面加载两次。但是,当我单击不应该工作的链接时(因为它包含 .php)它仍然有效!我在错误控制台中收到三个单词和一个错误,如下所示:
layout.js:25 clicked
layout.js:27 faded
jquery.min.js:4 GET pages/login1.php.php 404 (Not Found)
layout.js:29 loaded
但是每次我点击它时,页面仍然会加载到内容 div 中,并且它只会像它应该加载的那样加载一次......
因此,从我在这里建立的情况来看,当我单击链接时,jquery 获取 page.php 和 page.php.php 时发生了一些奇怪的现象
<a href="#" class="link" page="login1.php">
当我尝试使用以下链接获取甚至不在我的服务器上的页面时,会显示证明:
<a href="#" class="link" data-page="no">no</a>
,我遇到了 2 个错误:
jquery.min.js:4 GET pages/no 404 (Not Found)
jquery.min.js:4 GET pages/no.php 404 (Not Found)
这怎么可能?为什么 jquery 会这样做?任何人都可以尝试解释这里发生了什么吗?