首页 > 语言 > JavaScript > 正文

基于jQuery实现表单提交验证

2024-05-06 14:50:00
字体:
来源:转载
供稿:网友

html表单代码:
代码如下:
   <form method="post" action="">
       <div class="int">
          <label for="username">用户名:</label>
          <input type="text" id="username" class="required"/>
       </div>
       <div class="int">
           <label for="username">邮箱:</label>
           <input type="text" id="email" class="required"/>
       </div>
       <div class="int">
           <label for="username">个人资料:</label>
           <input type="text" id="personinfo"/>
       </div>
       <div class="sub">
           <input type="submit" value="提交" id="send"/>
           <input type="reset" id="res"/>
       </div>
   </form> 

jQuery代码:
代码如下:
          $(function(){
            $("form :input.required").each(function(){
                var $required = $("<strong class='high'>*</strong>");
                //$(this).parent().append($required);  //追加到文档中
                $(this).parent().prepend($required);
            });
            $('form :input').blur(function(){
                var $parent = $(this).parent();
                if($(this).is('#username')){
                   if(this.value==""||this.value.length<6){
                      var errorMsg = '请输入至少6位的用户名';

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选