1. 程式人生 > >HTML DOM Event

HTML DOM Event

回車 屬性列表 頁面 觸發 lur alert doc 失去 鼠標

HTML 事件觸發瀏覽器中的動作(action),比如當用戶點擊某個 HTML 元素時啟動一段 JavaScript。下面是一個屬性列表,這些屬性可插入 HTML 標簽來定義事件動作。

onclick        當用戶點擊某個對象時調用的事件句柄。
ondblclick     當用戶雙擊某個對象時調用的事件句柄。

onfocus        元素獲得焦點。               //練習:輸入框
onblur         元素失去焦點。               應用場景:用於表單驗證,用戶離開某個輸入框時,代表已經輸入完了,我們可以對它進行驗證.
onchange       域的內容被改變。             應用場景:通常用於表單元素,當元素內容被改變時觸發.(三級聯動)

onkeydown      某個鍵盤按鍵被按下。          應用場景: 當用戶在最後一個輸入框按下回車按鍵時,表單提交.
onkeypress     某個鍵盤按鍵被按下並松開。
onkeyup        某個鍵盤按鍵被松開。
onload         一張頁面或一幅圖像完成加載。
onmousedown    鼠標按鈕被按下。
onmousemove    鼠標被移動。
onmouseout     鼠標從某元素移開。
onmouseover    鼠標移到某元素之上。
onmouseleave   鼠標從元素離開

onselect      文本被選中。
onsubmit      確認按鈕被點擊。

  練習一、event及輸入框

<input class="keyword" type="text" onfocus="func1();" onblur="func2()" value="請輸入用戶名" >

<script>
    function func1(){
//        alert(111)
        var ky=document.getElementsByClassName("keyword")[0];
        ky.value=""
    }
    function func2(){
//        alert(222)
                var ky=document.getElementsByClassName("keyword")[0];
                if (ky.value.trim().length==0){
                    ky.value="請輸入用戶名"
                }

    }
</script>

  

HTML DOM Event