form元素是前端開(kāi)發(fā)人員高頻使用的元素之一拇派,經(jīng)常用于客戶(hù)端中提交表單。開(kāi)發(fā)中不難發(fā)現(xiàn)凿跳,當(dāng)form元素只含有一個(gè)input元素或者textarea元素的時(shí)候件豌,在輸入框被激活的同時(shí)按下回車(chē)鍵,當(dāng)前網(wǎng)頁(yè)會(huì)被強(qiáng)制刷新控嗜。造成此現(xiàn)象的原因是當(dāng)form元素只包含一個(gè)input時(shí)按回車(chē)會(huì)默認(rèn)提交表單茧彤,因此刷新。
解決方案有如下:
方案一》
在form元素內(nèi)部添加一個(gè)input元素:
<input type='text' style='display:none'/>
方案二》
將form元素去掉疆栏,為提交按鈕直接綁定submit事件
方案三》
為input元素添加onkeydown事件棘街,判斷按下回車(chē)時(shí)屏蔽提交
onkeydown="if(event.keyCode==13){return false;}"
方案四》
直接在form元素上添加如下代碼,阻止form元素的默認(rèn)提交事件
<form onsubmit="return false;"></form>