js表单
form 是一个表单,用来发送http请求,用来发送http请求。直观的说,只要用form将需要提交到服务器的标签包围,当提交的时候,就会向服务器发送有name属性的数据。所以,input内容提交必须有name属性。
<form action="/login" method="post" id="form1"> <span>用户</span> <input type="text" name="username" id="username"/><br/> <span>密码</span> <input type="password" name="password" id="passsword"/><br/> <input type="submit" value="提交"> </form>
acton:服务器接口路径
method:选择发送请求的方式,默认是get,通常是post.
elements:表单中所用控件的集合(HTMLCollection)
length:表单中控件的数量
reset():将所有表单域重置为默认值
submit():提交表单
获取表单元素一般有两种方式
通过id来获取,比如获取一个id名为form1的表单元素: document.getElementById('form1'); 通过docuemnt.forms获取name名为form1的表单元素: document.forms['form1'] //document.forms可以获取到当前页面中所有的表单元素,我们又可以通过方括号表示法获取某个属性,传入数值索引或name值。
表单验证
看一个小例子
<form action="/back/login/login" method="post" id="form1" οnsubmit="return sb1();">
function sb1(){ var username = document.getElementById("username"); var password = document.getElementById("passsword"); if(trim(username.value)==null || trim(username.value)==""){ alert("请输入用户名"); username.focus(); return false; } if(trim(password.value)==null || trim(password.value)==""){ alert("请输入密码"); password.focus(); return false; } return true; } function trim(str){ //删除左右两端的空格 return str.replace(/(^\s*)|(\s*$)/g, ""); }