检查是否使用javascript检查复选框不起作用

时间:2015-04-20 22:04:45

标签: javascript html forms checkbox

我有一个html表单,里面有一堆输入。在这个html表单中我还有一个复选框,然后我检查用户是否使用javascript进行了检查,唯一的问题是它不起作用。每当我点击按钮提交,然后应该通过代码运行并检查复选框是否被选中时,它只会给我一些错误,因为其他输入值没有设置它应该做的,但是我希望它只是检查是否选中了复选框,是否在if语句中执行了该功能,或者如果未选中该复选框,则运行警报消息。

这是我的脚本不起作用:

    <script type="text/javascript">
        $(document).ready(function() {  

        function checkBoxCheck() {

        if (document.getElementById('AcceptRules').checked) { //this is where I check if the checkbox is checked

        var handler = StripeCheckout.configure({
            key: 'removed for security',
            image: 'TestGPCheckoutImg.png',
            token: function(token) {

                var $form = $('#payment-form');

                $form.append($('<input type="hidden" name="stripeToken" />').val(token.id));

                $form.get(0).submit();
            }
        });

        $('#customButton').on('click', function(e) {

            var amount = Math.round($("#amount").val()*100);

            handler.open({
            name: 'Payment',
            description: 'desciption for produ',
            amount: amount
            });
            e.preventDefault();
        });

        $(window).on('popstate', function() {
            handler.close();
        });

        } else {
            alert("Remember to check the checkbox for terms of use"); //this is where I try to alert the user with a message
        }
    }

    });
        </script>

    <form id="payment-form" action="chargeCard.php" method="POST" name="payment-form">
    <input onkeypress="return isNumberKey(event)" type="text" name="amount" id="amount" value="" readonly/>
    <input type="text" name="emailForPayment" id="emailForPayment" placeholder="Enter Email"/>
    <input type="text" name="displayNameForPayment" id="displayNameForPayment" placeholder="Enter Display Name" maxlength="12"/>
    <input type="checkbox" id="AcceptRules" name="AcceptRuels" value="AcceptRules"/> <!-- this is the checkbox -->
    <input type="image"  src="image123.png" id="customButton" value="button" alt="button" onClick="checkBoxCheck()"/> <!--this is the button with the function in -->
    </form>

<script type="text/javascript">
                    function toDec(code) {
                    return code - 48;
                    }
                    function isNumberKey(evt)
                    {
                    var charCode = (evt.which) ? evt.which : event.keyCode
                    if (charCode > 31 && (charCode < 48 || charCode > 57 || toDec(charCode) != currentBid + 1)) 
                    return false;

                    return true;
                    }
                    </script>

1 个答案:

答案 0 :(得分:1)

你的范围是错误的。

&#13;
&#13;
$(document).ready(function () {
    // I don't work.
    function checkBoxCheck() {
        alert("I have local scope");
    }
});

function checkBoxCheck() {
    alert("I have global scopeage");
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onclick="checkBoxCheck();">Click</button>
&#13;
&#13;
&#13;

有关更好的解释,请参阅this answer