onblur :當元素失去焦點時觸發事件
onchange :當元素改變時觸發事件
oncontextmenu :當觸發上下菜單時觸發事件
onfous:單元素獲得焦點時觸發事件
onformchange :當標的改變時觸發該事件
onforminput:當表單獲得用戶輸入時觸發事件
oninput :當元素獲得用戶輸入時觸發事件
oninvalid: 當元素無效時觸發事件
onselect :當選取元素時觸發事件
onsubmit 當提交表當時觸發事件
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>表單事件實例</title>
<script type="text/javascript">
function p1(obj){
obj.select();
obj.style.color="#000";
}
function p2(obj){
if(obj.value==""){
obj.value=="請選擇城市"
obj.style.color="#999";
}
}
function p3(obj){
document.getElementById('text1').value=obj.value
document.getElementById('text1').style.color="#000";
}
</script>
</head>
<body>
<input type="text" id="text1" onfous="p1(this)" value="選擇城市"
style="color:#999" οnblur="p2(this)">
<select type="select" name=s1 οnchange="p3(this)">
<option selected value="北京">北京</option>
<option value="上海">上海</option>
<option value="福建">福建</option>
</select>
</body>
</html>
當輸入框text1獲取焦點時,選中其中的文本,輸入框text1的顏色變爲黑色:當光標離開輸入框text1時,如果它的內容爲空,則修改其值爲“選擇城市”,字體顏色爲灰色。但從下拉列表選擇不同的城市時,在文本中顯示選中的城市,並將字體顏色變爲黑色。