昨天尝试对着课本敲了一下自己学习的第一个js脚本,不多说,今天重新默着敲一遍,并记录哪些不理解。
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>HTML表单</title>
</head>
<body>
<form method="post" action="">
用户:<input type="text" name="" id="user"/><br/><br/>
密码:<input type="password" name="" id="password1"/><br/><br/>
确认:<input type="password" name="" id="password2"/><br/><br/>
<input type="submit" value="注册" onclick="return eg.Check();"/>
</form>
<script>
//定义一个全局命名变量,记得一定要加上{}
var eg={};
//下面这个函数的作用是将id的键值一一对应起来,方便接下来定义的变量调用,.$为一种方法
eg.$=function(id){
return document.getElementById(id);
}
//定义一个函数名为Check,注意与表单中的return 对应,获取指定的id元素变量并进行if判断
eg.Check=function(){
var u=eg.$("user");
var p1=eg.$("password1");
var p2=eg.$("password2");
if(u.value==''){
alert("用户名不可为空!");//显示文字
return false;
}
if(p1.value==''){
alert("密码不可为空!");//显示文字
return false;
}
if(p1.value!=p2.value){
alert("两次输入密码不同!");//显示文字
return false;
}
return true;
};
</script>
</body>
</html>
不是很理解的是:那个eg.$的用法,但百度到的是这是一种函数。
还有一些细致的地方,比如说:<input type="submit" value="注册" onclick="return eg.Check();"/>
这段代码的onclick就相当重要了,这是表单的语法里的,切不可输错!还有return的函数也是,不能少打(),这相当于在return就调用了Check函数!
以及下面这段的也不能在括号内少打id:
eg.$=function(id){
return document.getElementById(id);
}
还有u.value这个不能直接写为u==' '
if(u.value=='')
注意这些就差不多了,然后我们来看看火狐的测试效果!
是不是非常棒呢?一起做一个简单的登录验证吧!
教程参考:张泽娜的《JavaScript实战》