gpt4 book ai didi

javascript - 为什么不通过 jQuery 和 AJAX 更改段落?

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

我正在尝试将任意段落更改为外部文件中的内容。在这里:

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/

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