form表单相关的处理

1、阻止默认提交

1. <form>
   <input type="text" name="FirstName" value="Mickey"><br>
   <input type="button" onclick='on_submit(event)' value="提交">
   </form>
   <script>
       function on_submit(event){
           event.preventDefault()
       }
   </script>

2. <form onsubmit='return on_submit()'>
   <input type="text" name="FirstName" value="Mickey"><br>
   <input type="submit" value="提交">
   </form>
   <script>
       function on_submit(){
           //do something
           return false
       }
   </script>

2、分组选中框处理 

  

1. <form>
   <input type="checkbox" 
   	   name="item1" 
   	   value="love" 
   	   id='love' 
   	   onChange='test(this)'>
   	<label for='love'> I love you</label><br>
   <input type="checkbox" 
   	   name="item1" 
   	   value="lovet" 
   	   id='lovet' 
   	   onChange='test(this)'><label for='lovet'> I love you too</label><br>
   
   	<input type="checkbox" 
   		   name="item2" 
   		   value="dlove" 
   		   id='dlove' 
   		   onChange='test(this)'>
   	<label for='dlove'>I don't love you </label><br>
   <input type="checkbox" 
   	   name="item2" 
   	   value="dlovet" 
   	   id='dlovet' 
   	   onChange='test(this)'>
   	<label for='dlovet'> I don't love you either</label><br>
   </form>
   <script>
   	var choose_one=[];
   	function test(v){
   		var ft=[]
   		if(v.checked){
   			if(choose_one.length){  
   				ft=choose_one.filter(function _(v1){
   					var have_= v1.name == v.name
   					if(!have_) {
   						v1.checked=false
   					}
   					return have_
   				}) 
   			}
   			ft.push(v);
   		}
   		else{
   			if(choose_one.length){
   				ft=choose_one.filter(function _(v1){
   					return v1.id != v.id
   				}) 
   			}	
   		}
   		choose_one=ft;
   	}
   	</script>