Question

我需要一个复选框，单击该框后，您可以从一个页面移动到另一个页面。如果您已阅读旁边的条款和条件链接，则应该需要该复选框。

我只知道如何做到这一点，就像这样：

<input type="checkbox" value="confirm_prepay_terms" name="confirm_prepay_terms" align="middle" />

使用Jquery：

<script type="text/javascript" language="javascript">
$(document).ready(function() {
        if ($('form#prepay input:checkbox', 'confirm_prepay_terms').is(':checked') {
                return true;
        } else {
            $('#confirm_terms_hint').text('Please try again - you need to check the box to move on');
            $('#confirm_terms_hint').css('font-weight', 'strong');
            return false;
        }
}
</script>

目前我无法查看页面上的复选框，所以也许我的HTML不正确？

希望你能提供帮助。

Answer 1

您的HTML很好 - 会显示一个复选框 - 但没有任何文字。您可以使用此标记添加一些：

<input type="checkbox" value="confirm_prepay_terms" name="confirm_prepay_terms" align="middle" >Text here</input>

在您的JavaScript中，您错过了结束)：

if ($('form#prepay input:checkbox', 'confirm_prepay_terms').is(':checked') {

应该是

if ($('form#prepay input:checkbox', 'confirm_prepay_terms').is(':checked')) {

最后一行

和)：

}
</script>

应该是

})
</script>

并且您的选择器不正确

$('form#prepay input:checkbox', 'confirm_prepay_terms')

应该是

$('form#prepay input:checkbox[name=confirm_prepay_terms]')

这使用multiple attribute selector

和

$('#confirm_terms_hint').css('font-weight', 'strong');

应该是

$('#confirm_terms_hint').css('font-weight', 'bold');

font-weight没有strong值（see here）...而是使用bold

在您的脚本中，您将返回true或false但代码未被任何内容调用 - 只要页面完成加载就会执行。如果要执行表单验证，请查看jQuery中的.submit()方法。一个例子就是：

$(document).ready(function() {
    $('#prepay').submit(function() {
        if ($('form#prepay input:checkbox[name=confirm_prepay_terms]')) {
                return true;
        } else {
            $('#confirm_terms_hint').text('Please try again - you need to check the box to move on');
            $('#confirm_terms_hint').css('font-weight', 'bold');
            return false;
        }
    });
});

这会阻止现在提交表单 - 当您将false返回到提交事件时。

Fully working example here

Answer 2

我认为只要在使用服务之前必须接受此条款和条件，我们就不必提供CheckBox。

你可以自己做以下事情而且没有压力。

   - Provide a link to the terms and conditions for reading

   - Notify them that they have automatically accept this terms while proceeding.

如何在表单中执行强制复选框？

2 个答案: