首页 新闻 搜索 专区 学院

Jquery怎么循环遍历每个input框内容不能为空,并且正则验证必须为2-10个汉字,且给出对应的错误提示?

0
悬赏园豆:10 [已解决问题] 解决于 2017-05-07 16:06

1.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title> new document </title>
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
  <meta name="author" content="" />
  <meta name="keywords" content="" />
  <meta name="description" content="" />
  <link rel="stylesheet" type="text/css" href="" />
  <style type="text/css"></style>
  <script type="text/javascript" src="jquery-3.0.0.js"></script>
 </head>
 <body>
    <div>
            城市1:<input type="text" name="ceshi" class="eym" /><br /><br />
            城市2:<input type="text" name="ceshi" class="eym" /><br /><br />
            城市3:<input type="text" name="ceshi" class="eym" /><br /><br />
            城市4:<input type="text" name="ceshi" class="eym" /><br /><br />
            城市5:<input type="text" name="ceshi" class="eym" /><br /><br />
            城市6:<input type="text" name="ceshi" class="eym" /><br /><br />
    </div>
    <div style="">
        <input type="button" name="ceshi" value="提交" class="subcit" />
    </div>
    <script type="text/javascript">
        $(document).ready(function(){
        $(".subcit").click(function(){
        var city = $.trim($(".eym").val());
        
            });
    });
    </script>
 </body>
</html>
yangzailu的主页 yangzailu | 初学一级 | 园豆:11
提问于:2017-05-02 07:57
< >
分享
最佳答案
0

$('.eym').each(function(item)) {}

收获园豆:8
狼爷 | 小虾三级 |园豆:1192 | 2017-05-02 08:54
其他回答(3)
0

([\u4e00-\u9fa5]{2,10})这是2-10个汉字的正则表达式

筱浬 | 园豆:570 (小虾三级) | 2017-05-02 08:49
0

    function isLength(obj){   

        reg=[\u4e00-\u9fa5]{2,10};    

        if(!reg.test(obj)){   

            $("#test").html("<b>Please input correct figures</b>");   

       }else{   

            $("#test").html("");   

        }   

    } 

var $checkArray = $("input[name='ceshi']");
if(!$checkArray)return;
for(var i=0;i<$checkArray.length;i++){

var value=$checkArray[i].value;

isLength(value);

}

上善¤若水 | 园豆:235 (菜鸟二级) | 2017-05-02 13:34

怎么加上不为空的提示呢?并给出具体的哪一个错误。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title> new document </title>
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
  <meta name="author" content="" />
  <link rel="stylesheet" type="text/css" href="" />
  <style type="text/css"></style>
  <script type="text/javascript" src="jquery-3.0.0.js"></script>
 </head>
 <body>
    <div>
            城市1:<input type="text" name="ceshi" class="eym" value="" /><br /><br />
            城市2:<input type="text" name="ceshi" class="eym" value="" /><br /><br />
            城市3:<input type="text" name="ceshi" class="eym" value=""  /><br /><br />
            城市4:<input type="text" name="ceshi" class="eym" value=""  /><br /><br />
            城市5:<input type="text" name="ceshi" class="eym" value="" /><br /><br />
            城市6:<input type="text" name="ceshi" class="eym" value="" /><br /><br />
    </div>
    <div style="">
        <input type="button" name="cei" value="提交" class="subcit" />
    </div>
<script type="text/javascript">
        $(document).ready(function(){
            $(".subcit").click(function(){
                function isLength(obj){   
                    var reg=/^[\u4e00-\u9fa5]{2,10}$/;    
                    if(!reg.test(obj)){   
                        alert('输入内容不合法');return;
                    }else{   
                        alert('输入正确');
                    }  
                }
                var $checkArray = $("input[name='ceshi']");
                if(!$checkArray)return;
                    for(var i=0;i<$checkArray.length;i++){
                        var value=$checkArray[i].value;
                        isLength(value);
                    }
            });
        });
    </script>
 </body>
</html>

支持(0) 反对(0) yangzailu | 园豆:11 (初学一级) | 2017-05-04 14:36
0

第一步,首先声明一个样式,用来做出错误提示:

1         <style type="text/css">
2             .tip:after{content: "内容不符合要求";color: red;}
3         </style>

第二步,声明一个函数,也就是用来检测内容合不合法的函数:

 1             function checkLength(){
 2                 var inputs=$("input[name='ceshi']");
 3                 if(inputs.length===0)return;
 4                 var reg=/^[\u4e00-\u9fa5]{2,10}$/;
 5                 $.each(inputs, function(i,o) {
 6                     var content=$.trim($(o).val());
 7                     if(!reg.test(content)){
 8                         if(!$(o).hasClass("tip")){
 9                             $(o).addClass("tip");
10                         }
11                     }else{
12                         if($(o).hasClass("tip")){
13                             $(o).removeClass("tip");
14                         }
15                     }
16                 });
17             }

第三步,给提交按钮注册onclick事件,指向第二步的函数:

1             $(function(){
2                 $("input[name='cei']").on("click",checkLength);
3             });
收获园豆:2
YMSoft | 园豆:233 (菜鸟二级) | 2017-05-05 14:13
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册