為什么單擊后無法取消選中此復選框？

Question

我目前正在嘗試在網站上的表單中使用以下代碼

<p class="formtag">Minimum Price: </p>
<input type="number" style="width: 50px; margin-right: 15px;" name="minprice" id="minprice">
<p class="formtag">Maximum Price: </p>
<input type="number" style="width: 50px; margin-right: 15px;" name="maxprice" id="maxprice">


<p class="formtag">Show Only Free Resources </p>
<input type="checkbox" id="freecheck" onchange="disableprice()" name="freecheck" value="freeonly">

結合以下JavaScript

function disableprice() {
    if(document.getElementById('freecheck').checked = "true") {
        document.getElementById('minprice').value = "";
        document.getElementById('minprice').disabled = "disabled";
        document.getElementById('maxprice').value = "";
        document.getElementById('maxprice').disabled = "disabled";
    }

    else {
        document.getElementById('minprice').disabled = "false";
        document.getElementById('maxprice').disabled = "false";
    }

}

想法是，如果選中此復選框，則禁用最高和最低價格的輸入字段，否則應可編輯它們。

我遇到的問題是，一旦用戶選中了復選框，就不能取消選中該復選框。 我目前正在努力找出原因，但是我開始懷疑這與我對代碼document.getElementById('freecheck').checked = "true" 。

誰能建議我如何解決此問題？

Answer 1

您正在將值“ true”分配給checked，然后檢查其值，因此它始終為true ：

if(document.getElementById('freecheck').checked = "true") {

這是一個賦值，應該是兩個等號的比較。 另外，如@DavidThomas所述， checked屬性為boolean，因此您應檢查boolean的true值：

if(document.getElementById('freecheck').checked == true) {

要么

if(document.getElementById('freecheck').checked) {

Answer 2

if(document.getElementById("freecheck").checked = true){

//do something

}

參考： 如何取消選中復選框？

Answer 3

好的，這是您正在尋找的解決方案

這是您的復選框新代碼

<input type="checkbox" id="freecheck" onclick="myonclickhandler(this);" name="freecheck" value="freeonly">

雖然這是您的javasript代碼

<script type="text/javascript">
var t = document.getElementById("freecheck");

function myonclickhandler(t) {
    if (t.checked) {
        document.getElementById('minprice').value = "";
        document.getElementById('minprice').disabled = "disabled";
        document.getElementById('maxprice').value = "";
        document.getElementById('maxprice').disabled = "disabled";
    }
    else {
        document.getElementById('minprice').disabled = "false";
        document.getElementById('maxprice').disabled = "false";
    }
}
</script>

希望這可以幫助

Answer 4

喜歡以下內容，它將起作用：

更改您的JavaScript函數

function disableprice() {
    if(document.getElementById('freecheck').checked) {
        document.getElementById('minprice').value = "";
        document.getElementById('minprice').disabled = true;
        document.getElementById('maxprice').value = "";
        document.getElementById('maxprice').disabled = true;
    }

    else {
        document.getElementById('minprice').disabled = false;
        document.getElementById('maxprice').disabled = false;
    }

}

也找到工作的小提琴