想不通,我和老師代碼一樣的,為什么不能出現提示信息
<!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>
<meta?http-equiv="Content-Type"?content="text/html;?charset=gb2312"?/>
<title>無標題文檔</title>
<link?href="type.css"?rel="stylesheet"?type="text/css">
<script??src="vendor/jquery.validate-1.13.1.js"?type="text/javascript"></script>
<script?src="vendor/jquery-1.10.0.js"?type="text/javascript"></script>
</head>
<body>
<form?id="demoForm"?method='post'>
<fieldset>
<legend>用戶登錄</legend>
<p>
<label?for="username">用戶名</label>
<input?type="text"?id="username"?name="username">
</p>
<p>
<label?for="password">密碼</label>
<input?type="password"?id="password"?name="password">
</p>
<p>
<input?type="submit"?value="登錄">
</p>
</fieldset>
</form>
<script?type="text/javascript">
$(document).ready(function(){
$("#demoForm").validate({
rules:?{
username:{
required:true,
minlength:2,
maxlength:10
},
password:{
required:true,
minlength:2,
maxlength:16
}
}
messages:?{
username:{
required:"用戶名必須填寫",
minlength:"用戶名最少為2字符",
maxlength:"用戶名最大為10字符"
},
password:{
required:"密碼必須填寫",
minlength:"密碼最少為2字符",
maxlength:"密碼最大為16字符"
}
}
});
});
</script>
</body>
</html>為什么我不能產生提示信息呢
CSS樣式表
body {
? ? font-size: 36px;
? ? line-height: 1.6;
}
p {
? ? margin: 10px 0;
}
label {
? ? display: inline-block;
? ? min-width: 140px;
}
label.error {
? ? margin-left: 10px;
? ? color: red;
}
input, button {
? ? font-size: 36px;
? ? line-height: 35px;
? ? border: 1px solid #999;
? ? min-width: 180px;
}
input.error {
? ? border: 1px solid red;
}
input[type=submit], button {
? ? margin-top: 20px;
? ? font-size: 36px;
? ? padding: 10px 0;
}
/* CSS Document */
2015-11-07
<!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> ????<meta?http-equiv="Content-Type"?content="text/html;?charset=gb2312"?/> ????<title>無標題文檔</title> ????<style> ????????body?{ ????????????font-size:?36px; ????????????line-height:?1.6; ????????} ????????p?{ ????????????margin:?10px?0; ????????} ????????label?{ ????????????display:?inline-block; ????????????min-width:?140px; ????????} ????????label.error?{ ????????????margin-left:?10px; ????????????color:?red; ????????} ????????input,?button?{ ????????????font-size:?36px; ????????????line-height:?35px; ????????????border:?1px?solid?#999; ????????????min-width:?180px; ????????} ????????input.error?{ ????????????border:?1px?solid?red; ????????} ????????input[type=submit],?button?{ ????????????margin-top:?20px; ????????????font-size:?36px; ????????????padding:?10px?0; ????????} ????</style> ????<script?src="http://cdn.bootcss.com/jquery/1.10.0/jquery.js"></script> ????<script??src="http://cdn.bootcss.com/jquery-validate/1.13.1/jquery.validate.js"?type="text/javascript"></script> </head> <body> <form?id="demoForm"?method='post'> ????<fieldset> ????????<legend>用戶登錄</legend> ????????<p> ????????????<label?for="username">用戶名</label> ????????????<input?type="text"?id="username"?name="username"> ????????</p> ????????<p> ????????????<label?for="password">密碼</label> ????????????<input?type="password"?id="password"?name="password"> ????????</p> ????????<p> ????????????<input?type="submit"?value="登錄"> ????????</p> ????</fieldset> </form> <script?type="text/javascript"> ????$(document).ready(function(){ ????????$("#demoForm").validate({ ????????????rules:?{ ????????????????username:{ ????????????????????required:true, ????????????????????minlength:2, ????????????????????maxlength:10 ????????????????}, ????????????????password:{ ????????????????????required:true, ????????????????????minlength:2, ????????????????????maxlength:16 ????????????????} ????????????}, ????????????messages:?{ ????????????????username:{ ????????????????????required:"用戶名必須填寫", ????????????????????minlength:"用戶名最少為2字符", ????????????????????maxlength:"用戶名最大為10字符" ????????????????}, ????????????????password:{ ????????????????????required:"密碼必須填寫", ????????????????????minlength:"密碼最少為2字符", ????????????????????maxlength:"密碼最大為16字符" ????????????????} ????????????} ????????}); ????}); </script> </body> </html>兩個問題,1 應該先旨入jquery文件 后引入jquery-validate文件,因為jquery-validate對jquery有依賴。
2.第85(我的代碼85行)行少一個,