最終的にXMLHttpRequestによってロードされるDIVがあります。この新しい読み込まれたdivには更新が必要です(存在する場合)Javascript:XMLHttpRequestによってロードされたDOM要素を更新する
if (document.getElementById('newdiv') !== null) {
document.getElementById('newdiv').innerHTML= xhr.responseText;
}
は動作していないようです。以前のXMLHttpRequestによって挿入されたElementでこのチェックを実行すると、if (document.getElementById('newdiv') !== null)
がnullを返し、応答は挿入されません。ページの読み込み時にDOMにある要素でこれを実行している場合、それは機能します。
ページ読み込み後に読み込まれた(多分)要素の値を更新するにはどうすればよいですか?
、Javascriptをのみ 編集F1のために
<body>
<button onclick="f1()">
<input onchange="f2(this.value)"/>
<div id="parent"></div>
</body>
<script>
function f1() {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState === 4) {
if (xhr.status == 200 && xhr.status < 300)
console.log(xhr.responseText);
console.log(document.getElementById('parent'));
if (document.getElementById('parent') !== null) {
document.getElementById('parent').innerHTML= xhr.responseText;
}
}
postvars = somestuff;
xhr.open("POST", "req.py", true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.overrideMimeType("application/text");
xhr.send(postvars);
}
function f2(val) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState === 4) {
if (xhr.status == 200 && xhr.status < 300)
console.log(xhr.responseText);
console.log(document.getElementById('newdiv'));
if (document.getElementById('newdiv') !== null) {
document.getElementById('newdiv').innerHTML= xhr.responseText;
}
}
}
postvars = val;
xhr.open("POST", "req.py", true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.overrideMimeType("application/text");
xhr.send(postvars);
}}
</script>
にxhr.responseTextを明確にするためには、
ようになり、F2のため<div id="newdiv"></div>
xhr.responseTextのようになりますjqueryの無ください
fancy text
DOMに '#newdiv'をどのように埋め込んでいますか? 'console.log(document.getElementById( 'newdiv'));'は正確に何を生成しますか? – Xufox
私はXMLHttpRequestを挿入していますinnerHTML = xhr.responseText; newdivの親に –
質問に使用しているコードを編集することはできますか?私はまだこれがどのように応答を挿入している '#newdiv'を生成するのか分かりません。 – Xufox