5.7 表單事件及停止元素預設行為
透過事件物件來停止預設行為
寫法:
範例:連結
連結本身的預設行為是開啟連結,但因為某些情況下,不方便改成其它結構,那就可以先透過 JS 來停止其「開啟連結」這樣的預設行為。例:
練習:表單
需建立網頁檔來測試。
通常欄位上的資料,在送出前,都要先經過驗證,例如欄位必填,如果使用者未填資料,就要先停掉「資料送出」的預設行為。
表單的 submit 事件
html:
<form action="#" method="get" id="my_form">
<input type="text" id="my_text">
<button type="submit">資料送出</button>
</form>
JS: 表單的 submit 事件:
var my_form = document.getElementById("my_form");
my_form.addEventListener("submit", function(e){
// 資料送出時,執行這裡的程式
});
表單的停止預設行為
例: