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") {

这是一个赋值，它应该是与2个等号的比较。此外，正如@DavidThomas所述，checked属性是布尔值，因此您应该检查布尔值true：

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

或

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

Answer 2

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

//do something

}

参考：How do I uncheck a checkbox?

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;
    }

}

也找到工作小提琴 Fiddle

单击后为什么无法取消选中此复选框？

4 个答案: