form 表单

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, "");
    }

转载于:https://my.oschina.net/u/4004801/blog/3011453