如果复选框未选中，则禁用表单提交

Disable form submission if checkbox is unchecked

本文关键字：表单提交 复选框 如果      更新时间：2023-09-26

我正在尝试使用函数checkbox()来禁用表单提交。

有人能指出我做错了什么吗？

提前谢谢。

以下是JS:的代码片段

<script type = "text/javascript">
    function checkbox() {
        if(document.form.checkbox.checked)
        {
            document.form.submit.disabled=false;
        }
        else
        {
            document.form.submit.disabled=true;
        }
    }
</script>

这是HTML代码。

<form name="form" action="shop_paypal.php" method="post">
    <input name="cmd" type="hidden" value="_xclick" />
    <input name="no_note" type="hidden" value="1" />
    <input name="lc" type="hidden" value="UK" />
    <input name="currency_code" type="hidden" value="USD" />
    <input name="bn" type="hidden" value="PP-BuyNowBF:btn_buynow_LG.gif:NonHostedGuest" />
    <input type="hidden" name="item_name" id="item_name"value="YOUTUBE"/>
    <select name="amount" id="amount" style="width:256px; height:32px;">
        <option value="18" id="1">10,000 PINS - $18 </option>
        <option value="35" id="2">20,000 PINS - $35</option>
        <option value="75" id="3">30,000 PINS - $75</option>
        <option value="140" id="4">50,000 PINS - $140</option>
    </select>
    <label>Your Facebook fan page URL: </label><br />
    <input class="input-box" type="text" />
    <input type="text" />
    <input type="checkbox" class="checkbox" name="checkbox" id="checkbox"/> 
    <label class="agree">I agree to <a href="#">Terms & Conditions</a></label>
    <input type="image" src="images/products/buynow.gif" class="submit" onclick= "checkbox();" name = "submit"/>
</form>

显而易见的第一个想法是：

var form = document.getElementsByTagName('form')[0];
function check (){
    return document.getElementById('checkbox').checked;
}
form.addEventListener('submit', check);

试试这个，注意到函数是如何简化的，调用是如何移动到复选框本身的。选中时，按钮处于启用状态，未选中时，它处于禁用状态（这也是默认状态）。

这里还有一个工作演示：http://jsfiddle.net/kL7We/

<script>
    function enableSending() {
        document.form.submit.disabled = !document.form.checkbox.checked;
    }
</script>
<form name="form" action="shop_paypal.php" method="post">
   <input name="cmd" type="hidden" value="_xclick" />
   <input name="no_note" type="hidden" value="1" />
   <input name="lc" type="hidden" value="UK" />
   <input name="currency_code" type="hidden" value="USD" />
   <input name="bn" type="hidden" value="PP-BuyNowBF:btn_buynow_LG.gif:NonHostedGuest" />
 <input type="hidden" name="item_name" id="item_name"value="YOUTUBE"/>
 <select name="amount" id="amount" style="width:256px; height:32px;">
       <option value="18" id="1">10,000 PINS - $18 </option>
       <option value="35" id="2">20,000 PINS - $35</option>
       <option value="75" id="3">30,000 PINS - $75</option>
       <option value="140" id="4">50,000 PINS - $140</option>
  </select>
  <label>Your Facebook fan page URL: </label><br />
      <input class="input-box" type="text" />
      <input type="text" />
      <input type="checkbox" class="checkbox" name="checkbox" id="checkbox" onclick= "enableSending();"/> 
    <label for="checkbox" class="agree">I agree to</label> <a href="#">Terms & Conditions</a>
    <input type="button" src="images/products/buynow.gif" class="submit"  name = "submit" value="Send" disabled="disabled"/>
相关文章：