0

我是 HTML DOM 的新手。我正在尝试在选中复选框时更改值。所以这是我未完成的脚本：

<html>
<script type="text/javascript">
var val=12;
document.write("<p>"+val+"</p>");
function checkAddress()
{
    var chkBox = document.getElementById('checkAddress');
    if (chkBox.checked)
    {
        var val=val+2;
    }
}
function checkAddress2()
{
    var chkBox = document.getElementById('checkAddress2');
    if (chkBox.checked)
    {
        var val=val+3;
    }
}
function checkAddress3()
{
    var chkBox = document.getElementById('checkAddress3');
    if (chkBox.checked)
    {
        var val=val+4;
    }
}
</script>
<p>Get value :<input type="checkbox" id="checkAddress" name="checkAddress"    onclick="checkAddress()" value="1st"/>
Get value :<input type="checkbox" id="checkAddress2" name="checkAddress" onclick="checkAddress2()" value="2nd"/>
Get value :<input type="checkbox" id="checkAddress3" name="checkAddress" onclick="checkAddress3()" value="3rd"/>

在这里，我只想制作这个脚本：当复选框单击时，它会自动更改值。

4

1 回答 1

1

首先，每次都在 {} 中声明 val，这意味着该值丢失。

其次，你不会为了它有用而对 val 做任何事情。

最后，您可以使用一个函数而不是三个函数来传递被单击的特定复选框。

此外，如评论中所述，您没有将 val 分配给任何元素（使用 .innerHtml、textarea 等）。这意味着看不到价值。

 <html>

<script type="text/javascript">
var val=12;

function resetCheckboxes()
{
document.getElementById("checkAddress").checked=false;
document.getElementById("checkAddress2").checked=false;
document.getElementById("checkAddress3").checked=false;
}

function checkAddress(chkBox)
{
    var multiplyer = 1;

    if (!chkBox.checked)
    multiplyer = -1;

    if(chkBox.id =="checkAddress")
    val=val+ (multiplyer)*2;

    else if(chkBox.id =="checkAddress2")
    val=val+ (multiplyer)*3;

    else if(chkBox.id =="checkAddress3")
    val=val+ (multiplyer)*4;

    document.getElementById("displayValue").innerHTML = "Val:"+val;
}
</script>

<body onLoad="resetCheckboxes()">
<div id="displayValue">Val:12</div>
<p>Get value :<input type="checkbox" id="checkAddress" name="checkAddress"    onclick="checkAddress(this)" value="1st"/>
Get value :<input type="checkbox" id="checkAddress2" name="checkAddress" onclick="checkAddress(this)" value="2nd"/>
Get value :<input type="checkbox" id="checkAddress3" name="checkAddress" onclick="checkAddress(this)" value="3rd"/>
</body>
</html>
于 2013-05-26T21:26:39.313 回答