0

所以我有这个基本形式

<form id="order" action="contact.php" method="post">
    <p>Your name: <span><input type="text" name="name" id="fname"></span></p>
    <p>Your e-mail: <span><input type="text" name="email" id="femail"></span></p>
    <p><input type="checkbox" value="1" name="tos" id="ftos"></p>
    <p><input type="submit" value="Send" id="fsubmit"> | <span><input type="reset" value="Clear"></span></p>
</form>

如果未选中 TOS 复选框，我想要的只是使提交按钮有点褪色且不可点击。

如果复选框被选中，则按钮将退色并变为可点击。

我对 jquery 不是很擅长，但我相信它可以在 jquery 上完成。

我希望有人能帮助我。

问候，肯

4

2 回答 2

1

在这里...小提琴示例

HTML：

<form id="order" action="contact.php" method="post">
    <p>Your name: <span><input type="text" name="name" id="fname"></span></p>
    <p>Your e-mail: <span><input type="text" name="email" id="femail"></span></p>
    <p><input type="checkbox" value="1" name="tos" id="ftos"></p>
    <p><input type="submit" value="Send" id="fsubmit"> | <span><input type="reset" value="Clear"></span></p>
</form>

JS：

function checkTOS() {      
    var checkbox = $("#ftos").is(':checked');

    if (checkbox === true) {
       $("#fsubmit").prop("disabled",false);
    } else {
       $("#fsubmit").prop("disabled",true);
    }

}

jQuery(document).ready(function(){   
     checkTOS();
    $('#ftos').click( function() {
        checkTOS();
    });

});
于 2013-01-29T20:11:51.673 回答
1

w3schools.com是让您开始使用 HTML 和 JavaScript 的好地方。

disabled要回答您的问题，您应该通过向元素添加属性来使提交按钮不可点击并且看起来不同：

<input type="submit" value="Send" id="fsubmit" disabled="disabled" />

之后，在选中复选框后使按钮可点击：

<script type="text/javascript">
    jQuery(function ($) {

        $('#ftos').change(function () {

            if ($(this).is(':checked'))
                $('#fsubmit').removeAttr('disabled');
            else
                $('#fsubmit').attr('disabled', 'disabled');
        });
    });
</script>

检查这个小提琴！干杯!

于 2013-01-29T20:18:44.107 回答