使一個按鈕的顏色在HTML一段時間後發生變化

-1

我有一個按鈕，我需要它在一段時間後改變它的顏色。然後在按下之後，它應該重置並回到綠色。然後再次改變顏色。我該怎麼做呢？我希望它首先從綠色變爲黃色，然後從黃色變爲紅色。我似乎無法找到這樣的信息來做到這一點，我的HTML技能非常差。使一個按鈕的顏色在HTML一段時間後發生變化

在此先感謝！

下面是目前按鈕的代碼：

<input class="centered" type="button" onclick='''||'$("#bcTarget").barcode("'||SHOP_ORDER_OPERATION_API.GET_OP_ID(e.order_no,e.release_no,e.sequence_no,e.op_no)||'", "code128",{barWidth:2, barHeight:30});''' ||' value="Tarkastus" >

來源

2017-07-11 Moks99

試試這個，

基本input

<input id="btnTest" type="button" value="click"/>

Javascript代碼;

var col = "default"; //keep the color string 
setInterval(function() { 
    if (col == "default") { 
    $("#btnTest").css("background-color", "green"); 
    col = "green"; 
    } else if (col == "green") { 
    $("#btnTest").css("background-color", "yellow"); 
    col = "yellow"; 
    } else if (col == "yellow") { 
    $("#btnTest").css("background-color", "red"); 
    col = "red"; 
    } 
}, 2000); // 2 second interval 
$("#btnTest").on("click", function() { // on click change color to green 
    $("#btnTest").css("background-color", "green"); 
})

這裏是fiddle

希望幫助，

來源

2017-07-11 08:39:13 Berkay

這個工程！謝謝。我將如何循環這個？我希望它在點擊後回到黃色和紅色？ – Moks99

這只是爲了邏輯。間隔事件，單擊事件並顯示如何更改背景顏色。你應該實施其餘的。 @ Moks99 – Berkay

好吧！非常感謝，意味着很多。 @Berkay – Moks99

在這裏，你去與解決方案https://jsfiddle.net/20xj8skn/1/

changeColor = function(color) { 
 
    setTimeout(function(){ 
 
    document.getElementById("submit").style.background = color; 
 
    document.getElementById("submit").style.color = "#000"; 
 
    }, 2000); 
 
} 
 

 
clicked = function() { 
 
    changeColor('red'); 
 
} 
 

 
changeColor('yellow');

#submit { 
 
    background: rgb(0,255,0); 
 
    color: '#fff'; 
 
}

<input type="button" value="Submit" id="submit" onclick="clicked();"/>

我想這是你在找什麼。

來源

2017-07-11 08:32:21 Shiladitya

謝謝！幫助很多 – Moks99

使一個按鈕的顏色在HTML一段時間後發生變化

回答

相關問題