gpt4 book ai didi

javascript - 为什么我的 div 充满了整个页面?

转载 作者:行者123 更新时间:2023-12-02 18:56:03 25 4
gpt4 key购买 nike

我正在尝试使用 ajax 从另一个页面加载 div,但使用 History API 保持 URL 完整性。 ajax 和历史记录部分正在工作(即 div 正在加载并且 url 正在更改),但由于某种原因,我的 div 包含我的整个页面,而不仅仅是 div 中应有的内容!

原始页面和正在加载的页面 div 都是这种情况。

剥离 HTML

<!DOCTYPE html>
<html>
<body>
<div id="slider">
... all the page content
<a rel='tab' href="p/password.jsf">Forgot password?</a>
</div>
</body>
</html>

JS

<script>
$(function(){
$("a[rel='tab']").click(function(e){

//get the link location that was clicked
pageurl = $(this).attr('href');

//to get the ajax content and display in div with id 'content'
$.ajax({
url:pageurl + '?rel=tab',
success: function(data){
$('#slider').html(data);
}});

//to change the browser URL to 'pageurl'
if(pageurl!=window.location){
window.history.pushState({path:pageurl},'',pageurl);
}
return false;
});
});

/* the below code is to override back button to get the ajax content without reload*/
$(window).bind('popstate', function() {
$.ajax({
url:location.pathname+'?rel=tab',
success: function(data){
$('#slider').html(data);
}});
});
</script>

最佳答案

如果您想使用ajax获取页面的一部分,那么您可以使用带有元素的idload方法来从中获取内容。

$('#slider').load(pageurl + '?rel=tab #container_with_content_to_fetch', function() {
alert('callback after success.');
});

有关load()的更多信息:info

关于javascript - 为什么我的 div 充满了整个页面?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15343794/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com