表单处理[1]
// var fm=document.getElementById('myForm'); //第一種方法獲取
// var fm=document.getElementsByTagName('form')[0]; //第二種方法獲取
// var fm=document.forms[0]; //HTML DOM通過0下標獲取 //第三種方法獲取
// var fm=document.forms['yourForm']; //HTML DOM通過name下標獲取 第四種方法獲取
// var fm=document.yourForm; //向下兼容的方法,這種方式不推薦使用
表單處理:
submit事件觸發的一些問題:
<form id="myForm" name="yourForm">
姓名:<input type="text" name="user"/>
<input type="submit" value="提交"/>
</form>
這種方式是get方式提交,只有type="submit"的按鈕才能提交,普通按鈕不能提交
如果input的value沒有值,那么點擊提交后,網址為:file:///D:/workspace/gengxin/javascript/0.html?user=
如果input的value值是abc,那么點擊提交后,網址為:file:///D:/workspace/gengxin/javascript/0.html?user=abc
var fm=document.getElementById('myForm');
//阻止提交
addEvent(fm,'submit',function(evt){
preDef(evt);
})
//PS:submit事件,用傳統的方式:fm.οnsubmit=function(){};
//疑問:submit事件,為什么要用form對象來觸發呢?為什么不能是input中的submit按鈕觸發呢?
//PS:把submit事件注冊到input中的submit按鈕,是無法觸發submit事件的
//PS:必須把submit事件綁定到form對象上,才可以觸發submit事件
//PS:只不過觸發submit事件的流程是點擊input中的submit按鈕而已
------------------------------------------------------------------
讓非submit按鈕提交表單
<form id="myForm" name="yourForm">
姓名:<input type="text" name="user"/>
<input id="button" type="button" value="我其實不能提交"/>
</form>
addEvent(window,'load',function(){
var fm=document.getElementById('myForm');
//阻止提交
addEvent(fm,'submit',function(evt){
preDef(evt);
})
var button=document.getElementById('button');
addEvent(button,'click',function(){
fm.submit(); //可以讓非submit按鈕提交表單
})
})
strong標簽也可以提交
<form id="myForm" name="yourForm">
姓名:<input type="text" name="user"/>
<strong>其實我能提交</strong>
</form>
addEvent(window,'load',function(){
var fm=document.getElementById('myForm');
//阻止提交
addEvent(fm,'submit',function(evt){
preDef(evt);
})
var strong=document.getElementsByTagName('strong')[0];
addEvent(strong,'click',function(){
fm.submit(); //可以讓非submit按鈕提交表單
})
})
---------------------------------------------------------------
按住了ctrl和enter鍵提交
addEvent(window,'load',function(){
var fm=document.getElementById('myForm');
//阻止提交
addEvent(fm,'submit',function(evt){
preDef(evt);
})
addEvent(document,'keydown',function(evt){
var e=evt||window.event;
alert(e.keyCode)
if(e.ctrlKey && e.keyCode==13) fm.submit();
})
})
轉載于:https://www.cnblogs.com/gengxinnihaoma/p/7511612.html
總結