Javascript:检测复选框是否检查不起作用

时间:2011-04-06 04:45:28

标签: javascript checkbox onclick

我已经完成了所有的教程,并试图让我的头发发挥作用。

onClick正常触发,但它永远不会在IF循环中进行,它会检查复选框是否已被选中。

<!DOCTYPE html>
<html>
<head>
</head>

<header>
<script>

function updateTotal() {
document.orderform.total.value = 1*document.orderform.subtotal.value + 1*document.orderform.tax.value + 1*document.orderform.shipping.value;
}

**function applyDiscount(x) {


if (document.orderform.getElementById(x).checked == true) {
alert("Made it in if");
document.orderform.subtotal.value = .7*document.orderform.subtotal.value;
updateTotal();
}**

}

</script>
</header>

<body>


<section>
<h1>H1 here</h1>

<article>
<p>Article text here</p>
</article>

<form name="orderform" id="orderform" method="post" action="result.php">

<label for="firstname">First Name</label>
<input type="text" name="firstname" id="firstname" placeholder="Enter First Name Here" />
<br />


<label for="subtotal">Subtotal</label>
<input type="text" name="subtotal" id="subtotal" value="10" onChange="updateTotal()"/>
<br />

<label for="shipping">Shipping</label>
<input type="text" name="shipping" id="shipping" value="2" onChange="updateTotal()"/>
<br />

<label for="tax">Tax</label>
<input type="text" name="tax" id="tax" value="1" onChange="updateTotal()" />
<br />

<label for="total">Total</label>
<input type="text" name="total" id="total" value="13" />
<br />

<label for="discountbox">Apply 30% discount</label>
<input type="checkbox" name="discountbox" id="discountbox" onClick="applyDiscount(this.id)"/>

<input type="submit" name="submit" />

</form>

</section>

<footer>
<p>Footer here</p>
</footer>


</body>

5 个答案:

答案 0 :(得分:3)

你可以试着把这个条件

if (document.getElementById('discountbox').checked == true)

答案 1 :(得分:2)

尝试一些简单的事情:

if (document.getElementById(x).checked)

答案 2 :(得分:2)

问题是您的document.orderform是您的表单,getElementById是在文档上。

您可以这样做:

document.getElementById(x).checked

或:

document.orderform.elements[x].checked

答案 3 :(得分:0)

有些事情是错的:

  1. 应该在标签中。
  2. 行document.orderform.getElementById需要是document.getElementById
  3. 这对我来说很有用:

    <!DOCTYPE html>
    <html>
    <head>
    
    <script>
    
    function updateTotal() {
    document.orderform.total.value = 1 * document.orderform.subtotal.value + 1 * document.orderform.tax.value + 1 * document.orderform.shipping.value;
    }
    
    function applyDiscount(x) {
    
    
    if (document.getElementById(x).checked == true) {
    alert("Made it in if");
    document.orderform.subtotal.value = .7 * document.orderform.subtotal.value;
    updateTotal();
    }
    
    }
    
    </script>
    
    </head>
    <body>
    <header>
    Header Goes here.
    </header>
    
    <section>
    <h1>H1 here</h1>
    
    <article>
    <p>Article text here</p>
    </article>
    
    <form name="orderform" id="orderform" method="post" action="result.php">
    
    <label for="firstname">First Name</label>
    <input type="text" name="firstname" id="firstname" placeholder="Enter First Name Here" />
    <br />
    
    
    <label for="subtotal">Subtotal</label>
    <input type="text" name="subtotal" id="subtotal" value="10" onChange="updateTotal()"/>
    <br />
    
    <label for="shipping">Shipping</label>
    <input type="text" name="shipping" id="shipping" value="2" onChange="updateTotal()"/>
    <br />
    
    <label for="tax">Tax</label>
    <input type="text" name="tax" id="tax" value="1" onChange="updateTotal()" />
    <br />
    
    <label for="total">Total</label>
    <input type="text" name="total" id="total" value="13" />
    <br />
    
    <label for="discountbox">Apply 30% discount</label>
    <input type="checkbox" name="discountbox" id="discountbox" onClick="applyDiscount(this.id)"/>
    
    <input type="submit" name="submit" />
    
    </form>
    
    </section>
    
    <footer>
    <p>Footer here</p>
    </footer>
    
    
    </body>
    </html>
    

答案 4 :(得分:0)

我相信这就是你的意思:

<script>

function updateTotal() {
    document.getElementById("total").value = 1*document.getElementById("subtotal").value + 1*document.getElementById("tax").value + 1*document.getElementById("shipping").value;
}

function applyDiscount(x) {


if (document.getElementById(x).checked == true) {
    document.getElementById("subtotal").value = .7 * document.getElementById("subtotal").value;
    updateTotal();
    }

}