1

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

我只是半信半疑如何做到这一点，是这样的：

<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 不正确？

希望你能帮忙。

4

2 回答 2

3

您的 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]')

这使用了多属性选择器

和

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

应该

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

font-weight没有strong价值（见这里）...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提交事件时。

完整的工作示例在这里

于 2012-04-10T15:31:51.370 回答
-1

我认为您无需提供 CheckBox，只要他们在使用服务之前必须接受此条款和条件即可。

您可以自己做以下并减轻压力。

   - Provide a link to the terms and conditions for reading

   - Notify them that they have automatically accept this terms while proceeding.
于 2012-04-10T16:34:38.747 回答