使用javascript檢查複選框的按鈕

我試圖製作一個按鈕，它將在三種顏色之間切換：黑色，綠色和紅色，並將根據顏色檢查某個框。現在我可以使顏色切換，但我不能使複選框檢查。我將不勝感激。（顯然）我是初學者。使用javascript檢查複選框的按鈕

按鈕顏色綠色：複選框1種

按鈕顏色紅：複選框2

按鈕顏色黑色：不檢查或者盒1或2

腳本的樣子：

<script> 
var colors = ["green", "red", "black"] 

function setColor(el) { 
el.colorIdx = el.colorIdx || 0; 
el.style.color = colors[el.colorIdx++ % colors.length]; 
} 

</script>

HTML看起來像：

<html> 
<button onclick="setColor(this)">This is my Button</button> 
<input type="checkbox" name="box1" id="box1" /> 
<input type="checkbox" name="box2" id="box2" /> 
</html>

謝謝！

來源

2013-03-29 user2128093

我建議：

var colors = ["green", "red", "black"]; 

function setColor(el) { 
    el.colorIdx = el.colorIdx || 0; 
    el.style.color = colors[el.colorIdx++ % colors.length]; 
    document.getElementById('box1').checked = el.style.color == 'green'; 
    document.getElementById('box2').checked = el.style.color == 'red'; 
}

JS Fiddle demo。

來源

2013-03-29 23:03:19

那麼優雅B-）:) –

這是完美的。 – user2128093

@Still：非常感謝！並且，用戶2128093：我很高興得到了幫助！請，如果您覺得這個（或其他）答案可以解決您的問題，請考慮接受（檢查答案文本左側的複選標記）。 –

做這樣的：

var index = el.colorIdx++ % colors.length; 
if(index == 2) //2 is the index of color black 
{ 
    document.getElementById("box1").checked = false; 
    document.getElementById("box2").checked = false; 
} 
else if(index == 0) 
{ 
    document.getElementById("box1").checked = true;  
} 
else 
{ 
    document.getElementById("box2").checked = true;  
}

來源

2013-03-29 23:01:15

使用javascript檢查複選框的按鈕

回答

相關問題