我正在尝试将任意段落更改为外部文件中的内容。在这里:
External Files/text.txt :
jQuery and AJAX do go well together!
这是帮助更改段落的文件:
jquery_ajax1.html :
...
<script language="Javascript">
...
$('button').click(function() {
$('#p1').load('External Files/text.txt', function(responseText, statusTxt, xhr) {
if(statusTxt == 'success') {
window.alert("External content loaded successfully!");
}
if(statusTxt == 'error') {
window.alert("You've got problems." + "\n" + xhr.status + ": " + xhr.statusText);
}
});
});
</script>
<body>
...
<p id="p1">Click the below button to change me!</p>
<button>Click to change paragraph using jQuery and AJAX!</button>
</body>
当我运行程序时，我得到了段落和按钮，但是当我点击按钮时，段落并没有改变。我尝试将段落包装在 <div></div> 中，但没有任何效果。我最初尝试添加一个新段落并将文件附加到新段落。我还尝试注释掉该段落。没有任何效果。我的代码有问题吗？我该如何解决这个问题？
注意事项:
我看到了this question , this question , this question , this question ，还有更多，但它们并没有帮助我解决我的问题。
最佳答案
您的 Javascript 在您的 HTML 呈现之前运行，这意味着您将点击监听器附加到尚未在 DOM 中创建的按钮。因此，您的真实按钮不会附加点击监听器，因为它是在您的 Javascript 执行后加载的。
你应该几乎总是使用 jQuery's document ready method ，它将在执行您的 Javascript 之前等待文档完全加载，确保您想要与之交互的元素已经加载。
在您的情况下，您应该能够在 Javascript 中执行此操作。
$(function() {
$('button').click(function() {
$('#p1').load('External Files/text.txt', function(responseText, statusTxt, xhr) {
if (statusTxt == 'success') {
window.alert("External content loaded successfully!");
}
if (statusTxt == 'error') {
window.alert("You've got problems." + "\n" + xhr.status + ": " + xhr.statusText);
}
});
});
})
关于javascript - 为什么不通过 jQuery 和 AJAX 更改段落？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38213755/