gpt4 book ai didi

javascript - Ajax:将内容从另一个div加载到div中

转载 作者:行者123 更新时间:2023-11-28 06:42:29 24 4
gpt4 key购买 nike

当在同一 div 中单击链接时,我尝试使用 ajax 更改 div 的内容(如 html)。我对ajax不太熟练,所以我很确定这是一个菜鸟问题。我尝试在网上搜索解决方案,但没有成功。

我有一个 id 为“main”的 div,在其中我试图创建一个 id 为“link01”的链接。当单击“link01”时,我希望“main”从另一个页面中的另一个div(site2.html 中的“txt2”-div)加载内容。但我无法让它工作。

首先,这是我的index.html页面:

<head>
<title>site1</title>
<meta charset="UTF-8">
</head>

<body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$('#link01').click(function() {
$('#main').load('site2.html #txt2', function() {});
});
});
</script>
<div id="main">
<a>
<div id="link01">link</div>
</a>
Main div where the content will change</div>
<br>
<br>
</body>

</html>

这是我的 site2.html 页面:

<!DOCTYPE html>
<html>

<head>
<title>Site2</title>
<meta charset="UTF-8">

</head>

<body>

<div id="txt2">Text that will go into the main div at the index-page when link01 is clicked (contains links, images, etc)</div>

</body>

</html>

我可能完全误解了一些东西。

最佳答案

有一种非常糟糕的实践方法可能有效...但是您确实应该有一个服务器端代码来监听您的ajax调用,并仅返回所需的HTML片段作为响应。话虽如此,试试这个,它可能有效(没有检查):

$(function() { 
$('#link01').click(function(){
$.ajax({
url: 'site2.html',
type: 'GET',
success: function(data){
data = $(data);
var $div = $('#txt2', data);
$('#main').html($div);
}
});
});
});

关于javascript - Ajax:将内容从另一个div加载到div中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33670541/

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