-3

我有一个联系表格。它会询问您的姓名，然后询问您是否希望通过电话或电子邮件与您联系。除非用户选择电话或电子邮件的单选按钮，否则电话和电子邮件字段将被隐藏。一旦您点击电话或电子邮件，我会验证他们是否输入了正确的电话或电子邮件地址。

我的问题是如果用户没有点击任何一个单选按钮，如何检查 JQuery Validation 并打印出错误消息？

4

3 回答 3

1

您只是在问如何验证一组单选按钮吗？由于您没有显示任何代码，所以我只能向您展示如何radio input使用插件验证一组 '。

然后，您将使用内置rules方法从相应的输入中动态添加/删除规则。同样，我需要在自定义解决方案之前查看您的代码。

工作演示：http: //jsfiddle.net/PbHwX/

jQuery :

$(document).ready(function () {

    $('#myform').validate({
        rules: {
            radiotest: {
                required: true
            }
        },
        messages: {
            radiotest: {
                required: "please select at least one option"
            }
        }
    });

});

HTML：

<input type="radio" name="radiotest" value="0" />
<input type="radio" name="radiotest" value="1" />

文档： http ://docs.jquery.com/Plugins/Validation

于 2013-01-20T17:42:03.737 回答
0

更新 (2012-01-20 19:38)：我想我理解你在寻找什么，并注意到你想使用 jQuery 的验证插件。

这是一个关于 JSFiddle的工作演示（注意：我从 Sparky 的小提琴中分叉）

默认情况下，仅设置有关单选按钮的规则。所有的消息都是预先设置好的，表单的特定字段是隐藏的。现在，每当单击单选按钮时，我都会隐藏无用的字段，删除相应的规则。我还显示了正确的字段并添加了相应的规则。

您要查找的特定代码必须类似于：

    /* Toggle fields */
    $('#mailfields').hide();
    $('#phonefields').show();

    /* Remove email rule */
    $('input:text[name=emailadress]').rules('remove');

    /* Add a requirement rule for phone */
    $('input:text[name=phonenumber]').rules('add', { required: true });

第一个答案：您说当用户选择两个收音机（电子邮件或电话）中的一个时，您会显示一个或另一个相应的字段。因此，我假设您已经有一些 jQuery 代码，每次用户单击一个单选按钮时都会运行这些代码。

此代码可以添加一个类或隐藏字段或您喜欢的任何内容（或任何这种情况下的最佳常见做法，遗憾的是我没有足够的经验知道这一点......）这让您稍后知道用户确实选择了一个选项。

如果您可以显示更多代码（例如jsFiddle），我可以给您一个更具体的答案。不过，这就是我要做的：

  1. 使表单的所有字段都已在 HTML 文档中
  2. 使用 jQuery 和 CSS 根据需要隐藏/显示字段

  3. 测试总是一样的：

    (phoneRadio.selected && phoneField.filled)
|| (mailRadio.selected && mailField.filled)

让我知道这有什么帮助。

于 2013-01-20T17:28:42.413 回答
-1

如果您有多种形式并使用 ASP.NET MVC 等，则可以使用 jquery unobtrusive。或者您可以执行以下操作：

演示

$('#form').click(function (e) { // or $form.submit handler
    if ($('#email').val() == "") // or you can use an regex validation
    {
       e.preventDefault();
        // set message here
        $('#message').css('color', 'red').append('email invalid !');
    }
});

$('form').submit(function (e) {
    alert('submited :' + $('#email').val());
});
于 2013-01-20T17:43:24.003 回答