在提交时更改按钮颜色,直到输入新文本

Changing a buttons colour on submit until new text is entered

本文关键字:新文本 输入 文本 提交 颜色 按钮      更新时间:2024-03-31

提交按钮时,是否可以在一段时间内更改按钮的颜色,直到整个过程再次开始?

只需将element.style.backgroundColor = "color";放在流程的不同步骤上。示例:

function steps() {
  var button = document.getElementById("btn");
  button.style.backgroundColor = "orange";  
  setTimeout(function(){ button.innerHTML = "1"; }, 1000);
  setTimeout(function(){ button.innerHTML = "2"; }, 2000);
  setTimeout(function(){ button.innerHTML = "3"; }, 3000);
  setTimeout(function(){ button.style.backgroundColor = "tomato"; }, 4000);
  setTimeout(function(){  
    button.innerHTML = "click here";
    button.style.backgroundColor = "skyblue"; }, 6000);  
}
button {
  width: 100px;
  padding: 15px;
  background: skyblue;  
}
<button id=btn onclick="steps()">click here</button>

试试这个

document.getElementById('send_btn').style["background-color"]="red"
setTimeout(function() {
  document.getElementById('send_btn').style["background-color"] = ""
}, 1000) // 1000 - This value is in ms. (here time is 1second)