Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/68.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 登录表单验证_Javascript_Jquery_Html - Fatal编程技术网

Javascript 登录表单验证

Javascript 登录表单验证,javascript,jquery,html,Javascript,Jquery,Html,下面是验证表单的代码。但是,这段代码中有一个bug。当我在用户名中输入某个内容并将密码留空时,表单接受它。它不应该接受它。知道为什么吗 <html> <head> <link type = "text/css" type="text/javascript" rel="stylesheet" href="css/bootstrap.css" /> <script src="http://ajax.googleap

下面是验证表单的代码。但是,这段代码中有一个bug。当我在用户名中输入某个内容并将密码留空时,表单接受它。它不应该接受它。知道为什么吗

<html> 

     <head>  <link type = "text/css" type="text/javascript" rel="stylesheet" href="css/bootstrap.css" />
              <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
       <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>

       <script src="js/bootstrap.js"> </script>
     <script> 
       $(document).ready(function() {
    $('form').validate({
        submitHandler: function(form) { // for demo
            alert('valid form');
            return false;
        }
    });
});</script>
     </head> 


 <body> 
<form class="well span6"> 

     <label>Username</label> 
     <input type="text" id="myName" class="span3 required" placeholder="Type your username here..." />  <br/> 

      <label>Password</label> 
     <input type="text" id="myPassword" class="span3 required" placeholder="Type your password here..." /> <br/> 

     <input type="submit" class ="btn btn-primary">
     <!-- <button class=""> Clear <br/></button><br/> -->

</form> 

</body> 

</html> 

$(文档).ready(函数(){
$('form')。请验证({
submitHandler:函数(表单){//用于演示
警报(“有效形式”);
返回false;
}
});
});
用户名

密码

我很确定这个验证插件就像字段上的“name”属性

我在每个输入上都添加了
name=“myName
name=“myPassword
,它似乎在这种情况下工作


用户名

密码

尝试将“name”属性添加到密码和用户名字段中。

是否尝试为表单提供id?@Adam是对的,您必须为每个输入都提供name属性。陌生人,
.validate()
插件工作得非常好,如中所示。您的问题在代码的其他地方,我建议您构造一个JSFIDLE演示。那个JSFIDLE不适合我(ff 17)。只有当你专注于然后不专注于密码时,它才会起作用。我现在确信Adam是正确的,并且每个浏览器处理
占位符的方式是在忽略
名称时导致不一致的原因。无论如何,
name
属性不应该被忽略。@Sparky看到这个,我的朋友,你删除了“name”字段,你看到了原来的错误
<form class="well span6">    
     <label>Username</label> 
     <input name="myName" type="text" id="myName" class="span3 required" placeholder="Type your username here..." /><br/> 

      <label>Password</label> 
     <input name="myPassword" type="text" id="myPassword" class="span3 required" placeholder="Type your password here..." /><br/> 

     <input type="submit" class="btn btn-primary">
</form>