在dom中提供了为我们提供了操作表单当中的一些控件的方法,比如说获取,操作还有一些特殊的属性。
获取:表单元素的操作 onchange事件
表单事件:onsubmit onreset
window.onload= function () {
var myform=document.getElementById('form1');
// alert(myform.text1.value);
// onchange:当值发生改变的时候触发
myform.text1.onchange= function () {
alert(this.value);
};
myform.sex[1].onchange= function () {
alert(this.value);
};
myform.a[0].onchange= function () {
alert(this.value);
};
myform.city.onchange= function () {
alert(this.value);
};
myform.tijao.onclick= function () {
// alert(myform.sex[0].value);
for(var i=0;i<myform.sex.length;i++){
if(myform.sex[i].checked){
alert(myform.sex[i].value+'被选中了');
}else{
alert(myform.sex[i].value+'没有选中');
}
}
};
};
<form id="form1">
<input type="text" name="text1" value="内容"/>
<input type="radio" value="男" name="sex"/>男
<input type="radio" value="女" name="sex"/>女
<input type="checkbox" name="a" value="我是checkbox1111111"/>1
<input type="checkbox" name="a" value="我是checkbox222222222"/>2
<input type="checkbox" name="a" value="我是checkbox3333333333"/>3
<select name="city">
<option value="">请选择城市</option>
<option value="北京">北京</option>
<option value="上海">上海</option>
<option value="河北" >河北</option>
</select>
<input type="button" value="提交" name="tijao"/>
</form>
window.onload= function () {
var myform=document.getElementById('form1');
// onsubmit:当提交表单的时候触发
// onreset:当表单重置的时候触发
// myform.submit();
myform.onsubmit= function () {
if(myform.text1.value==''){
alert('请写点东西');
return false;
}
};
myform.onreset= function () {
// var a=confirm('确定重置吗');
// if(a){
// return true;
// }else{
// return false;
// }
// return a;
return confirm('确定重置吗')
};
};
<form id="form1" action="http://www.baidu.com">
<input type="text" name="text1"/>
<input type="submit" name="sub" value="提交"/>
<input type="reset" name="res" value="重置"/>
</form>