javascript - 从 ajax 调用加载 html 内容
[英]javascript - load html content from ajax call
问题描述
I have HTML page that has Ajax call to load table content
我有一个 HTML 页面，它有 Ajax 调用来加载表格内容
<html>
....
<script sec:haspermission="VIEW_NOTE" th:inline='javascript'>
require(['app/agent/viewGlobalAgent'], function (){
var individualId= [[${model.agent.individual.id}]];
var agentId= [[${model.agent.id}]];
$.get("/notes/referenceTable.html?individualId="+individualId+"&agentId="+agentId, function(data){
console.log("theData " , data);
var noteList = $("#note-list-container2").value;
var fileList = $("#file-list-container2").value;
// document.getElementById("note-list-container").innerHTML = noteList;
// document.getElementById("note-file-form").innerHTML = fileList;
$("#note-list-container").html(noteList);
$("#note-file-form").html(fileList);
});
</script>
....
</html>
the html that Ajax call load Ajax 调用加载的 html
<div>
<div id="note-list-container2">
....
</div>
<div id="file-list-container2">
....
</div>
</div>
I need to access these two div on callback of Ajax call我需要在 Ajax 调用的回调中访问这两个 div
$.get("/notes/referenceTable.html?individualId="+individualId+"&agentId="+agentId, function(data){
I tried to access them but its not working我试图访问它们但它不起作用
$("#note-list-container2").value
is any way to access div in loaded html在加载的 html 中访问 div 的任何方式
3 个解决方案
解决方案1
2 已采纳 2020-09-07 21:44:09
Since you want content from within the new html returned as data you want to wrap that data in $() and query within that object由于您希望新 html 中的内容作为data返回，因此您希望将该数据包装在$()并在该对象中进行查询
Then use text() or html() since value is only for form controls, not content elements然后使用text()或html()因为value仅用于表单控件，而不是内容元素
$.get(url, function(data) {
var $data = $(data);
var noteList = $data.find("#note-list-container2").text();// or html()
var fileList = $data.find("#file-list-container2").text();
$("#note-list-container").html(noteList);
$("#note-file-form").html(fileList);
});
解决方案2
1 2020-09-07 21:45:24
jQuery.text() : Get the combined text contents of each element in the set of matched elements, including their descendants, or set the text contents of the matched elements
jQuery.val() : Get the current value of the first element in the set of matched elements or set the value of every matched element.
A div element does not have a value.... div 元素没有值....
An example:一个例子：
console.log('text(): ' + $("#note-list-container2").text()); console.log('val(): ' + $("#note-list-container2").val());
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="note-list-container2"> .... </div>
解决方案3
1 2020-09-07 21:48:42
I'm guessing you're using jQuery.我猜你正在使用 jQuery。 The HTML contents can be accessed with .html() not with value. HTML 内容可以通过 .html() 而不是值来访问。 There is no value attribute on a div element. div 元素上没有 value 属性。 More importantly, you should attempt to get the contents of the element AFTER updating it, not before.更重要的是，您应该尝试在更新元素之后而不是之前获取元素的内容。 Also, the selectors should match.此外，选择器应该匹配。 From your example, it seems that you're attempting to get the contents for a #note-list-container2 but you're updating a #note-list-container element.从您的示例中，您似乎正在尝试获取 #note-list-container2 的内容，但您正在更新 #note-list-container 元素。 One of those IDs is wrong, given your sample AJAX call output.鉴于您的示例 AJAX 调用输出，这些 ID 之一是错误的。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.