0

我正在研究 JavaScript 并测试一个我认为可以阻止选中复选框的函数（代码示例）：

<!DOCTYPE html>
<html>
<body>
<script type="text/javascript" charset="utf-8">
var myBox = document.getElementById('bike');
myBox.addEventListener('click', stopCheck, false);

function stopCheck(e){
    e.preventDefault();
}
</script>

<form action="">
<input type="checkbox" name="vehicle" value="Bike" id="bike" >I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car 
</form>

</body>
</html>

但代码不起作用。可能在复选框更改选中状态后执行 stopCheck 。如何解决？

4

3 回答 3

2

工作演示

您script无法找到元素。

只需在表单之后/结束body标记之前移动您的脚本。

于 2013-10-15T14:54:02.910 回答
1

可能是因为当您使用 document.getElementById 时，Dom 树还没有完全创建。移动下面的脚本可能会有所帮助：

<form action="">
<input type="checkbox" name="vehicle" value="Bike" id="bike" >I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car 
</form>
<script type="text/javascript" charset="utf-8">
var myBox = document.getElementById('bike');
myBox.addEventListener('click', stopCheck, false);

function stopCheck(e){
    e.preventDefault();
}
</script>
于 2013-10-15T14:54:42.313 回答
-1

使用document.getElementsByName返回一个包含名称的元素数组，在本例中为复选框。

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>

<script>
    window.onload = function() {
       var vehicle = document.getElementsByName("vehicle");

        for(var i=0;i<vehicle.length;i++){
            vehicle[i].onclick = function(e) {
                e.preventDefault();
            };
        }



    };

</script>

<form action="">
    <input type="checkbox" name="vehicle" value="Bike" id="bike" >I have a bike<br>
    <input type="checkbox" name="vehicle" value="Car">I have a car
</form>
</body>
</html>
于 2013-10-15T14:56:54.503 回答