Question

这个脚本有什么问题？我只想在innerHTML中显示复选框状态，单击按钮后显示“是”，如果选中，则显示“否”。

<html>
<body>
<p id="demo"></p>

<input id="chkbox" type="checkbox" name="Terms" value="agree" ><br>
<input type="button" value="button" onClick="myFunction()" >

<script>
function myFunction() {

 var box = document.getElementById("chkbox");
 if(checkbox.checked)
  {
  var checked.value = "yes";
    var txt = checked.value;
 document.getElementById("demo").innerHTML = txt;
   }
   else if(checkbox.unchecked)
{
  var unchecked.value = "no";
  var txt = unchecked.value;
 document.getElementById("demo").innerHTML = txt;
}

   }
 </script>
 </body>

Answer 1

存在多个问题。

没有名称为checkbox
语法var checked.value = "yes";无效

尝试

<input type="button" value="button" onClick="myFunction()">

然后

function myFunction() {
    var box = document.getElementById("chkbox");
    box.value = box.checked ? "yes" : 'no';
    document.getElementById("demo").innerHTML = box.value;
}

演示：Fiddle

由于使用了jQuery标签，因此在页面中包含jQuery库

<input type="button" value="button" id="button">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

和

//dom ready handler
jQuery(function ($) {
    //cache the elements for future use
    var $chk = $('#chkbox'), // id-selector
        $demo = $('#demo');
    //click event handler
    $('#button').click(function () {
        //use is() and :checked-selector to check whether the checkbox is checked and use .text() to set the display text of the p element
        $demo.text($chk.is(':checked') ? 'yes' : 'no')
    })
})

演示：Fiddle

Answer 2

function myFunction() {
    var box = document.getElementById("chkbox");
    if(box.checked)
    {
        document.getElementById("demo").innerHTML = 'yes'
    }
    else
    {
        document.getElementById("demo").innerHTML = 'no';
    }
}

代码中的问题是：

您设置变量box，但之后使用checkbox.checked而不是box.checked。
你找了checkbox.unchecked。没有这样的财产;如果.checked不成立，则取消选中此框。
您尝试声明变量checked.value和unchecked.value。变量名不能包含.，用于在访问值为对象的变量时指定对象属性。

Answer 3

检查一下

function myFunction() {
      if(document.getElementById('chkbox').checked) {
        alert("checked");
    } else {
       alert("not checked")
    }
    }

Answer 4

尝试：

您已将元素分配给box而不是checkbox
没有像checkbox.unchecked
var name checked.value格式不正确。

这是代码：

function myFunction() {
   var box = document.getElementById("chkbox");
   if (box.checked) {
    document.getElementById("demo").innerHTML = "yes";
   } else {
    document.getElementById("demo").innerHTML = "no";
   }
}

Here is working Demo

Answer 5

尝试这样的事情，速记

function myFunction(){
    var box = document.getElementById("chkbox").checked;
    document.getElementById("demo").innerHTML = box ? 'yes' : 'no';
}

复选框javascript显示状态

5 个答案: