gpt4 book ai didi

javascript - 如何使用ajax从另一个页面获取div内容

转载 作者:行者123 更新时间:2023-11-28 20:22:36 25 4
gpt4 key购买 nike

我有一个本地2个html文件,我想做的是在第一个html中使用ajax调用来更改另一个html文件div中的div的内容,但是有些功能警报如何,但是div中的内容也不会改变警报返回(对象对象)这是我在第一个 html 中使用的内容

function loadQuiz(){ 
$.ajax({
url: 'loadQuiz.html',
success: function(data) {
data=$(data).find('div#test');
$('#fill').html(data);
alert(data);
}
});


<span id="fill">
</span>

这是我想要获取div内容的另一个html文件

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="css/styling.css" />
<link rel="stylesheet" href="css/colors.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="jquery.sortable.js"></script>
</head>
<body>
<div id="bar">
<li class="disabled"><span id="noQuestions"><a href="#top" class"toplink"="">
Top</a></span> </li>
<!-- <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> <li id="quest-header"><a href="#top"> Top</a></li> <li id="quest1"><a href="#Question1Edit"><i id="q1" class="icon-remove"></i> Question 1</a></li> <li id="quest2"><a href="#Question2Edit"><i id="q2" class="icon-remove"></i> Question 2</a></li> <li id="quest3"><a href="#Question3Edit"><i id="q3" class="icon-remove"></i> Question 3</a></li> <li id="quest4"><a href="#Question4Edit"><i id="q4" class="icon-remove"></i> Question 4</a></li> <li id="quest5"><a href="#Question5Edit"><i id="q5" class="icon-remove"></i> Question 5</a></li> -->
<li id="nav1" draggable="true"> Question 1</li><li id="nav2" draggable="true"> Question 2</li><li id="nav3" draggable="true"> Question 3</li>
</div>

<div id="test">
<div class="editBar" id="Question1Edit"><img class="trash" src="images/trashcan_closed.png" onmouseover="this.src='images/trashcan_open.png'" onmouseout="this.src='images/trashcan_closed.png'" alt="Trash" onclick="deleteQuestion(1)">
<img class="edit" src="images/edit.png" onclick="editQuestion(1)" alt="edit"> 1. True or False: loaded question 1 (7 Points) <br><br><div class="answerField"><div class="answerField"><input type="radio" name="Answer1Value" value="True" checked="checked"> True<br><input type="radio" name="Answer1Value" value="False"> False<br></div></div></div><br><div class="editBar" id="Question2Edit"><img class="trash" src="images/trashcan_closed.png" onmouseover="this.src='images/trashcan_open.png'" onmouseout="this.src='images/trashcan_closed.png'" alt="Trash" onclick="deleteQuestion(2)"> <img class="edit" src="images/edit.png" onclick="editQuestion(2)" alt="edit"> 2. Multiple Choice: loaded question 2 (6 Points) <br><br><div class="answerField"><div class="answerField"><input type="checkbox" name="Answer2Value" value="Answer1"> a <br><input type="checkbox" name="Answer2Value" value="Answer2" checked="checked"> b <br><input type="checkbox" name="Answer2Value" value="Answer3"> c <br></div></div><br><div class="editBar" id="Question3Edit"><img class="trash" src="images/trashcan_closed.png" onmouseover="this.src='images/trashcan_open.png'" onmouseout="this.src='images/trashcan_closed.png'" alt="Trash" onclick="deleteQuestion(3)"> <img class="edit" src="images/edit.png" onclick="editQuestion(3)" alt="edit"> 3. Fill After: loaded question 3 (6 Points) <br><br><div class="answerField"><textarea name="Answer3Value" cols="40" rows="5">annswer</textarea></div></div><br></div>
</div>
</body>
</html>

最佳答案

正是出于这个原因,您可以使用 jQuery 的 .load()

$('#another-page-div-loads-here').load('another-page.html #some-div-on-other-page');

这是专门为您提供的示例。

$('#fill').load('loadQuiz.html #test');

关于javascript - 如何使用ajax从另一个页面获取div内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17983348/

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