我需要一些代码帮助，因为我在设置计时器时遇到了更改文本的问题。当我单击一个按钮时，它将禁用该按钮，它将在我启动计时器3秒钟时更改文本，然后启用它并将文本更改回原来的位置。
当我尝试这个：
<button name="btn1" id="btn1" type="submit" class="btn btn-primary btn-block button-size">Click Here!</button>
<script type="text/javascript">
$('#btn1').click(function(){
document.getElementById("btn1").innerHTML = "<span><i class=\'fa fa-spinner fa-spin\'></i> Loading</span>";
document.getElementById('btn1').disabled = true;
setTimeout(function(){
document.getElementById('btn1').disabled = false;
}, 3000);
if(document.getElementById("btn1").disabled == true)
{
document.getElementById("btn1").innerHTML = "Click Here again!";
}
});
</script>
它不会让我将文本更改回原来的位置，因为计时器在3秒后仍显示带有fa-spin图标的Loading。
我也尝试过这个：
<script type="text/javascript">
function CheckTimer(){
document.getElementById("btn1").innerHTML = "<span><i class=\'fa fa-spinner fa-spin\'></i> Loading</span>";
document.getElementById("btn1").value="Please wait";
document.getElementById('btn1').disabled = true;
setTimeout(function(){
document.getElementById('btn1').disabled = false;
}, 3000);
if(document.getElementById("btn1").disabled == false)
{
document.getElementById("btn1").innerHTML = "Click Here!";
}
}
</script>
我仍然遇到同样的问题。我已经尝试找到答案，但是在任何地方都找不到。
您能给我一个例子，我如何将文本更改回单击按钮启动计时器3秒钟后的文本，该按钮将禁用按钮并更改文本，直到计时器结束，这样我才能更改文字回到原来的位置？
谢谢。
javascript参考方案
您可以只在超时的回调中设置按钮的文本。这是一个纯JavaScript实现：
<button
name="btn1"
id="btn1"
type="submit"
class="btn btn-primary btn-block button-size"
>
Click Here!
</button>
<script type="text/javascript">
const btn = document.getElementById("btn1");
btn.onclick = function(e) {
btn.innerHTML =
"<span><i class='fa fa-spinner fa-spin'></i> Loading</span>";
btn.disabled = true;
setTimeout(() => {
btn.disabled = false;
btn.innerText = "Click here again!";
}, 3000);
};
</script>
我正在使用Pyramid构建一个Webapp，但是Knockout的行为有所不同。我有一个表格： <div data-bind="with: $root.itemToAdd" style="display: none;"> <form data-bind="submit: $root.add…
如何使用PHP从动态输入字段捕获数组值？ - javascript我正在编写一个在线时间跟踪网页，允许用户将学习时间输入该系统。用户将首先输入名称，然后根据日期输入学习时间。一天中可能会有多个学习时间。以下是我第一页的编码，<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"…
iframe的占位符内容 - javascript我想在iframe中自动显示数据库中的内容，因为它是创建文档时提交的正文内容。我正在尝试插入JS Php，如下所示：<iframe name="editor" id="editor" class="doc_body" ></iframe></div> <sc…
当我点击按钮时重新加载另一页 - javascript我正在处理文件myfile.php。在这个文件中，我有以下代码：<button type='submit' name='refresh' onclick='refresh()'></button> <script> function refresh(){ setT…
如何在页面加载期间添加带有图像的选项以供选择？ - javascript现在，我有一个dropDownList，它是一个带有“ Option”元素的“选择” HTML控件，已经是runat =“ server”，代码如下：<select name="webmenu" id="webmenu" class="fWidth" runat="server�…