JavaScript鏈接下拉菜單複選框

我想鏈接我的HTML下拉菜單到我的表中有複選框。JavaScript鏈接下拉菜單複選框

此javascript函數試圖看到如果「弧」值已被選擇，則禁用該複選框3，其示出了光譜：

function showShields() 
{ 
if (document.getElementById("Shield").value == ("arc") 
{ 
document.getElementById("checkBox3").disabled=true; 
} 
}

這是HTML代碼：

<!DOCTYPE html> 

<html> 
<head> 
<script src="SpiritShield.js"></script> 
</head> 
<body> 
<p>What kind of shield are you interested in?</p> 
<select id="Shield"> 
    <option value="arc">ARC</option> 
    <option value="divine">GAS</option> 
    <option value="spectral">MIG</option> 
    <option value="elysian">ANY</option> 
</select> 
</body> 
<table border="2" cellspacing="0"> 
<tr> 
    <th>Checkbox</th> 
    <th>Shield</th> 
</tr> 
<tr> 
    <td><input type="checkbox" id="checkBox1"</td> 
    <td>ARC1</td> 
</tr> 
<tr> 
    <td><input type="checkbox" id="checkBox2"</td> 
    <td>ARC2</td> 
</tr> 
<tr> 
    <td><input type="checkbox" id="checkBox3"</td> 
    <td>SPECTRAL1</td> 
</tr> 
<tr> 
    <td><input type="checkbox" id="checkBox4"</td> 
<td>SPECTRAL2</td> 
</tr> 
</table> 

</html>

莫非

有人幫我解決這個問題？

謝謝

來源

2012-11-14 Gary

在HTML是無效的，有一些未封閉的標籤。 –

嗯在哪裏？另外我不認爲這就是爲什麼我的javascript功能沒有工作的原因:( – Gary

Muthu是正確的，你的/ body標籤是你選擇後，你應該把它移動到/ html之前的底部 – Sean

你的代碼是正確的，雖然我沒有注意到如果條件丟失的圓括號：

function showShields() 
{ 
if (document.getElementById("Shield").value == ("arc")) //your missing missing parenthesis was here 
{ 
document.getElementById("checkBox3").disabled=true; 
} 
}

來源

2012-11-14 12:37:34 Sean

嗨，感謝您的回覆。上述仍然不幸的工作。當我從下拉菜單中選擇ARC時，表格中的複選框未被禁用。 :( – Gary

試試這個：http://jsfiddle.net/Hpcsq/2/

function showShields(what) 
    { 
    if (what.value == ("arc")) 
     { 
     document.getElementById("checkBox3").checked=false; 
     } 
    } 

<!DOCTYPE html> 

<!DOCTYPE html> 

<html> 
<head> 
<script src="SpiritShield.js"></script> 
</head> 
<body> 
<p>What kind of shield are you interested in?</p> 
<select id="Shield" onchange="showShields(this)"> 
     <option value="arc">---</option> 
    <option value="arc">ARC</option> 
    <option value="divine">GAS</option> 
    <option value="spectral">MIG</option> 
    <option value="elysian">ANY</option> 
</select> 
</body> 
<table border="2" cellspacing="0"> 
<tr> 
    <th>Checkbox</th> 
    <th>Shield</th> 
</tr> 
<tr> 
    <td><input type="checkbox" id="checkBox1"</td> 
    <td>ARC1</td> 
</tr> 
<tr> 
    <td><input type="checkbox" id="checkBox2"</td> 
    <td>ARC2</td> 
</tr> 
<tr> 
    <td><input type="checkbox" id="checkBox3" checked="checked"></td> 
    <td>SPECTRAL1</td> 
</tr> 
<tr> 
    <td><input type="checkbox" id="checkBox4"</td> 
<td>SPECTRAL2</td> 
</tr> 
</table> 

</html>

來源

2012-11-14 12:38:26 Tschallacka

嗨，感謝您的回覆，該代碼只是勾選了方框，我希望它能禁用複選框，以便用戶無法點擊。 – Gary

我已更新代碼，再次檢查。錯了;-) – Tschallacka

好的謝謝，但它不工作大聲笑。你可以用js試試這個代碼來看看它是否有效。所以，當弧選項被選中時，表格應該自動禁用複選框3. Ta – Gary

JavaScript鏈接下拉菜單複選框

回答

相關問題