jquery 验证组包含 2 个输入字段。两者都存在或两者都为空都是有效的

发布于 2024-12-05 19:02:11 字数 1573 浏览 0 评论 0原文

我希望两个值都存在。或者两个值都为空才有效我将如何更改此演示以允许两个 INPUT 字段在空白时都有效？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang='en' lang='en'>
<head>
    <title>test</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="http://www.tanela.com/testbin/jquery-validation/jquery.validate.js"></script>   

    <script type="text/javascript">
    $(document).ready(function(){
    $("#myform").validate({
            groups: {
                username: "fname lname"
            },
            errorPlacement: function(error, element) {
            if (element.attr("name") == "fname" 
                ||  element.attr("name") == "lname")
                    error.insertAfter("#lastname");
                else
                error.insertAfter(element);
           },
           debug:true
        })
    });
  </script>

</head>
<body>
  <form id="myform" action="">
    <div>
    <label>Your Name</label>
    <input name="fname" class="required" value="Pete" />
    <input name="lname" id="lastname" class="required" />
    <br/>
    <input type="submit" value="Submit"/>
    </div>
</form>
</body>
</html>

原文

I want Both values to be present. Or both values to be blank to be VALID
How would I go about changing this demo to allow both INPUT fields to be valid when blank?

here is a link to it at http://jsbin.com/otalir

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang='en' lang='en'>
<head>
    <title>test</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="http://www.tanela.com/testbin/jquery-validation/jquery.validate.js"></script>   

    <script type="text/javascript">
    $(document).ready(function(){
    $("#myform").validate({
            groups: {
                username: "fname lname"
            },
            errorPlacement: function(error, element) {
            if (element.attr("name") == "fname" 
                ||  element.attr("name") == "lname")
                    error.insertAfter("#lastname");
                else
                error.insertAfter(element);
           },
           debug:true
        })
    });
  </script>

</head>
<body>
  <form id="myform" action="">
    <div>
    <label>Your Name</label>
    <input name="fname" class="required" value="Pete" />
    <input name="lname" id="lastname" class="required" />
    <br/>
    <input type="submit" value="Submit"/>
    </div>
</form>
</body>
</html>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

黄昏下泛黄的笔记 2024-12-12 19:02:11

你可以做这样的事情。看看这个小提琴

var firstNameElem = $('[name=fname]'),
    lastNameElem = $('[name=lname]');

$('[name=fname],[name=lname]').keyup(function(){
  if(firstNameElem.val() != "" || lastNameElem.val() != ""){
    firstNameElem.addClass('required');
    lastNameElem.addClass('required');
  }else{
    firstNameElem.removeClass('required');
    lastNameElem.removeClass('required');
  }
});

You could do something like this. Check out this fiddle

var firstNameElem = $('[name=fname]'),
    lastNameElem = $('[name=lname]');

$('[name=fname],[name=lname]').keyup(function(){
  if(firstNameElem.val() != "" || lastNameElem.val() != ""){
    firstNameElem.addClass('required');
    lastNameElem.addClass('required');
  }else{
    firstNameElem.removeClass('required');
    lastNameElem.removeClass('required');
  }
});

回复收藏 0 原文

~没有更多了~