html-----020----事件
html事件
?
<body> <a href="http://www.cctv.com" accesskey="k" target="_blank">按alt鍵加上k鍵可以實(shí)現(xiàn)跳轉(zhuǎn)</a> <br /> <a href="http://www/baidu.com" accesskey="l" target="_blank">按alt鍵和l鍵可以跳轉(zhuǎn)到百度</a> <!--注釋:以下元素支持 accesskey 屬性: <a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>--> </body> </html> accesskey 規(guī)定激活元素的快捷鍵。?
?
<title>無(wú)標(biāo)題文檔</title> <style type="text/css"> h1.intro{color:red; text-align:center;} .imo{background-color:blue;} </style> </head><body> <!--注釋:class 屬性不能在以下 HTML 元素中使用:base, head, html, meta, param, script, style 以及 title。--> <h1 class="intro">中華人民共和國(guó)</h1> <h1 class="imo intro">可以插入多個(gè)css樣式</h1> </body> </html> Class屬性<!--class 規(guī)定元素的一個(gè)或多個(gè)類名(引用樣式表中的類)-->
?
?
<body> <!--contenteditable 屬性規(guī)定元素內(nèi)容是否可編輯。--> <p contenteditable="true">這是一個(gè)可編輯的段落</p> <p contenteditable="false">這是一個(gè)不可編輯的段落.默認(rèn)</p><!--dir 屬性在以下標(biāo)簽中無(wú)效:<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。--> <p dir="ltr" >笑傲江湖</p><!--默認(rèn):從左到右--> <p dir="rtl" >笑傲江湖</p><!--從右到左--><!--draggable 規(guī)定元素是否可拖動(dòng)。--> <p draggable="auto">令狐沖</p><!--使用瀏覽器的默認(rèn)行為。--> <p draggable="false">令狐沖</p><!--規(guī)定元素不可拖動(dòng)--> <p draggable="true">令狐沖</p><!--規(guī)定元素可以拖動(dòng)--><!--目前所有主流瀏覽器都不支持 contenteditable 屬性。--> <p dropzone="copy">方正大師</p><!--拖動(dòng)數(shù)據(jù)會(huì)產(chǎn)生被拖動(dòng)數(shù)據(jù)的副本。--> <p dropzone="link">方正大師</p><!--拖動(dòng)數(shù)據(jù)會(huì)產(chǎn)生指向原始數(shù)據(jù)的鏈接。--> <p dropzone="move">方正大師</p><!--拖動(dòng)數(shù)據(jù)會(huì)導(dǎo)致被拖動(dòng)數(shù)據(jù)被移動(dòng)到新位置。--><p hidden="hidden">沖虛道長(zhǎng)</p> <p hidden="false">沖虛道長(zhǎng)</p> <p hidden="true">沖虛道長(zhǎng)</p></body> contenteditable/dir /-draggable/dropzone/hidden?
?
<title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function change_header() {document.getElementById("suibian").innerHTML="Nice day!"; } </script> </head><body> <h1 id="suibian">你好啊</h1> <button onclick="change_header()">改變文章</button> </body> </html> onclick事件?
<body> <!--注釋:lang 屬性在以下標(biāo)簽中無(wú)效:<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>--> <!--規(guī)定元素內(nèi)容的語(yǔ)言。--> <p lang="cs">這人</p><!--所有瀏覽器均支持 lang 屬性。--> <p lang="af">這人</p> <p lang="ar">這人</p> <p lang="be">這人</p> <p lang="bg">這人</p> <p lang="ca">這人</p> <p lang="cs">這人</p> <p lang="da">這人</p> <p lang="de">這人</p> <p lang="el">這人</p> <!--spellcheck=true/false:對(duì)不對(duì)元素進(jìn)行拼寫(xiě)和語(yǔ)法檢查---> </body> lang 屬性?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>無(wú)標(biāo)題文檔</title> <body> <p>data-* 用于存儲(chǔ)頁(yè)面或應(yīng)用程序的私有定制數(shù)據(jù)。</p> <p> data-* 屬性用于存儲(chǔ)頁(yè)面或應(yīng)用程序的私有自定義數(shù)據(jù)。</p> <p> data-* 屬性賦予我們?cè)谒?HTML 元素上嵌入自定義 data 屬性的能力。 存儲(chǔ)的(自定義)數(shù)據(jù)能夠被頁(yè)面的 JavaScript 中利用,以創(chuàng)建更好的用戶體驗(yàn)(不進(jìn)行 Ajax 調(diào)用或服務(wù)器端數(shù)據(jù)庫(kù)查詢)。</p> <p> data-* 屬性包括兩部分: ?屬性名不應(yīng)該包含任何大寫(xiě)字母,并且在前綴 "data-" 之后必須有至少一個(gè)字符 ?屬性值可以是任意字符串</p> <p> 注釋:用戶代理會(huì)完全忽略前綴為 "data-" 的自定義屬性。 data-* 屬性是 HTML5 中的新屬性。</p> <p>下面是用法</p> <ul> <li data-animal-type="bird">Owl</li> <li data-animal-type="fish">Salmon</li><li data-animal-type="spider">Tarantula</li> </ul> </body> </html> data-*屬性僅在html5 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>無(wú)標(biāo)題文檔</title> <body> <p>contextmenu 規(guī)定元素的上下文菜單。上下文菜單在用戶點(diǎn)擊元素時(shí)顯示。</p> <div contextmenu="mymenu"> <menu type="context" id="mymenu"> <menuitem label="Refresh"></menuitem> <menuitem label="Twitter"></menuitem></menu> </div><p>contextmenu 屬性規(guī)定元素的上下文菜單。當(dāng)用戶右鍵點(diǎn)擊元素時(shí),會(huì)出現(xiàn)上下文菜單。 contextmenu 屬性的值是要打開(kāi)的 menu 元素的 id。</p> </body> </html> contextmenu屬性html5中 <body> <!--style屬性樣式--> <!--一個(gè)或多個(gè)由分號(hào)分隔的 CSS 屬性和值。--> <h1 style="color:blue; text-align:center">為了新中國(guó)的勝利前進(jìn)</h1> <p style="color:red;">岳林山的</p><!--tabindex 屬性,是tab鍵的順序--> <!--以下元素支持 tabindex 屬性:<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。--> <button tabindex="1">第一個(gè)</button> <button tabindex="2">第二個(gè)</button> <button tabindex="3">第三個(gè)</button><!--title是額外顯示--> <a href="http://www.cctv.com" title="這是令狐沖的">按鈕</a> <!--title是abbr和acronym的必須元素--> <abbr title="這也是令狐沖的">按鈕</abbr> <acronym title="這是岳靈珊的" >按鈕</acronym> <!--translate 屬性:translate="yes|no"是否翻譯元素的內(nèi)容--></body> tabindex 屬性,style屬性,title,abbr縮寫(xiě),acronym定義縮寫(xiě)Window?事件屬性,最常用在body中
接下來(lái)的觸發(fā)事件都用到了body中
?
<title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function prin() { alert("感謝您的訪問(wèn)");} </script> <script type="text/javascript"><body onunload="prin()"> <!--onunload一旦頁(yè)面已下載時(shí)觸發(fā)(或者瀏覽器窗口已被關(guān)閉)--> <!--在用戶從頁(yè)面導(dǎo)航離開(kāi)時(shí)發(fā)生(通過(guò)點(diǎn)擊鏈接、提交表單或者關(guān)閉瀏覽器窗口等等--> <h1>歡迎訪問(wèn)我的首頁(yè)</h1> <p>請(qǐng)關(guān)閉窗口,或按 F5 刷新頁(yè)面。</p> </body> </html> onunload事件---見(jiàn)下面?
?其他的window事件屬性
| 屬性 | 值 | 描述 |
| onerror | script | 在錯(cuò)誤發(fā)生時(shí)運(yùn)行的腳本。 |
| onhaschange | script | 當(dāng)文檔已改變時(shí)運(yùn)行的腳本。 |
| onmessage | script | 在消息被觸發(fā)時(shí)運(yùn)行的腳本。 |
| onoffline | script | 當(dāng)文檔離線時(shí)運(yùn)行的腳本。 |
| ononline | script | 當(dāng)文檔上線時(shí)運(yùn)行的腳本。 |
| onpagehide | script | 當(dāng)窗口隱藏時(shí)運(yùn)行的腳本。 |
| onpageshow | script | 當(dāng)窗口成為可見(jiàn)時(shí)運(yùn)行的腳本。 |
| onpopstate | script | 當(dāng)窗口歷史記錄改變時(shí)運(yùn)行的腳本。 |
| onredo | script | 當(dāng)文檔執(zhí)行撤銷(xiāo)(redo)時(shí)運(yùn)行的腳本。 |
| onstorage | script | 在?Web?Storage?區(qū)域更新后運(yùn)行的腳本。 |
| onundo | script | 在文檔執(zhí)行?undo?時(shí)運(yùn)行的腳本。 |
?
?
?
?
Form?事件
?
由?HTML?表單內(nèi)的動(dòng)作觸發(fā)的事件(應(yīng)用到幾乎所有?HTML?元素,但最常用在?form?元素中):
?
<title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function upperCase() { var x=document.getElementById("fname").value document.getElementById("fname").value=x.toUpperCase() } </script><body> <!--onblur script 元素失去焦點(diǎn)時(shí)運(yùn)行的腳本。--> <p>請(qǐng)輸入您的姓名,然后把焦點(diǎn)移動(dòng)到字段外:</p> 請(qǐng)輸入您的姓名(英文字符): <input type="text" name="fname" id="fname" onblur="upperCase()"></body> </html> onblur屬性?
?
<title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function checkField(val) { alert("輸入值已更改。新值是:" + val); } </script><body> <!--onchange 在元素值改變時(shí)觸發(fā)。 onchange 屬性適用于:<input>、<textarea> 以及 <select> 元素。--> <p>請(qǐng)修改輸入字段中的文本,然后在字段外點(diǎn)擊以觸發(fā) onchange。</p> <p>原來(lái)的值是hello</p> 請(qǐng)輸入文本: <input type="text" name="txt" value="Hello" onchange="checkField(this.value)"> </body> </html> onchange事件?
?
<title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function setStyle(x) { document.getElementById(x).style.background="yellow"; } </script><body> <!--onfocus 屬性在元素獲得焦點(diǎn)時(shí)觸發(fā)。 onfocus 常用于 <input>、<select> 以及 <a>. 提示:onfocus 屬性與 onblur 屬性相反。 注釋:onfocus 屬性不適用于以下元素:<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style> 或 <title>。--> <p>當(dāng)輸入字段獲得焦點(diǎn)時(shí)觸發(fā)函數(shù)。此函數(shù)改變輸入字段的背景色。</p>First name: <input type="text" id="fname" onfocus="setStyle(this.id)"><br> Last name:<input type="text" id="lname" onfocus="setStyle(this.id)"> </body> onfocus事件?
?
<title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function showMsg() { alert("您選中了一些文本!"); } </script><body> <!--onselect 屬性在元素中的文本被選中時(shí)觸發(fā)。 onselect 屬性可用于以下元素內(nèi):<input type="file">、<input type="password">、<input type="text">、<keygen> 以及 <textarea>--> 一些文本:<input type="text" value="請(qǐng)選中我!" onselect="showMsg()"><p>函數(shù) showMsg() 在輸入字段中的文本被選中時(shí)觸發(fā)。此函數(shù)顯示一段消息。</p> </body> </html> onselect事件 <title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function checkForm() { alert("表單已提交!"); } </script><body> <!--onsubmit 屬性在提交表單時(shí)觸發(fā)。 onsubmit 屬性只在 <form> 中使用。--> <form action="qwd-1.html" onsubmit="checkForm()"> 姓:<input type="text" name="lname"><br> 名:<input type="text" name="fname"><br> <input type="submit" value="提交"> </form><p>函數(shù) checkForm() 在提交按鈕被點(diǎn)擊時(shí)觸發(fā)。此函數(shù)向用戶顯示一段消息。</p> </body> </html> onsubmit 屬性| 屬性 | 值 | 描述 |
| oncontextmenu | script | 當(dāng)上下文菜單被觸發(fā)時(shí)運(yùn)行的腳本。 |
| onformchange | script | 在表單改變時(shí)運(yùn)行的腳本。 |
| onforminput | script | 當(dāng)表單獲得用戶輸入時(shí)運(yùn)行的腳本。 |
| oninput | script | 當(dāng)元素獲得用戶輸入時(shí)運(yùn)行的腳本。 |
| oninvalid | script | 當(dāng)元素?zé)o效時(shí)運(yùn)行的腳本。 |
| onreset | script | 當(dāng)表單中的重置按鈕被點(diǎn)擊時(shí)觸發(fā)。HTML5?中不支持。 |
?
Keyboard?事件
?
| 屬性 | 值 | 描述 |
| onkeydown | script | 在用戶按下按鍵時(shí)觸發(fā)。 |
| onkeypress | script | 在用戶敲擊按鈕時(shí)觸發(fā)。 |
| onkeyup | script | 當(dāng)用戶釋放按鍵時(shí)觸發(fā)。 |
?
?
<title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function displayResult() { var x; if(window.event) // IE8 以及更早版本 {x=event.keyCode;} else if(event.which) // IE9/Firefox/Chrome/Opera/Safari {x=event.which;} var keychar=String.fromCharCode(x); alert("按鍵 " + keychar + " 被按下"); } </script><body> <p> onkeydown 屬性在用戶(在鍵盤(pán)上)按鍵時(shí)觸發(fā)。<p> <h3> 提示:相對(duì)于 onkeydown 事件的事件次序: onkeydown onkeypress onkeyup</h3> <!--注釋:onkeydown 屬性不適用以下元素:<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style> 或 <title>。--> <p>當(dāng)用戶在輸入字段中按下按鍵時(shí)觸發(fā)函數(shù)。此函數(shù)提示用戶已按按鍵。</p><input type="text" onkeydown="displayResult()"> </body> </html> onkeydown事件?
?
?
<title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function displayResult() { var x; if(window.event) // IE8 以及更早版本 {x=event.keyCode;} else if(event.which) // IE9/Firefox/Chrome/Opera/Safari {x=event.which;} keychar=String.fromCharCode(x); alert("按鍵 " + keychar + " 被按下"); } </script><body> <p> onkeydown 屬性在用戶(在鍵盤(pán)上)按鍵時(shí)觸發(fā)。<p> <h3> 提示:相對(duì)于 onkeydown 事件的事件次序: onkeydown onkeypress onkeyup</h3> <!--注釋:在任何瀏覽器中,onkeypress 事件不會(huì)被所有按鍵觸發(fā)(例如 ALT、CTRL、SHIFT、ESC)。 注釋:onkeypress 屬性不適用以下元素:<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style> 或 <title>。--> <p>當(dāng)用戶在輸入字段中按下按鍵時(shí)觸發(fā)函數(shù)。此函數(shù)提示用戶已按按鍵。</p><input type="text" onkeypress="displayResult()"> </body> </html> onkeypress事件 <title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function displayResult() { var x=document.getElementById("fname"); x.value=x.value.toUpperCase(); } </script><body> <p> onkeyup 屬性在用戶(在鍵盤(pán)上)釋放按鍵時(shí)觸發(fā)。<p><!--注釋:onkeyup 屬性不適用以下元素:<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style> 或 <title>--> <p>當(dāng)用戶在輸入字段中按下按鍵時(shí)觸發(fā)函數(shù)。此函數(shù)把字符轉(zhuǎn)換為大寫(xiě)。</p>請(qǐng)輸入您的姓名(英文字符): <input type="text" id="fname" onkeyup="displayResult()"> </body> </html> onkeyup 事件屬性?
Mouse?事件
由鼠標(biāo)或類似用戶動(dòng)作觸發(fā)的事件:
1:onclick 元素上發(fā)生鼠標(biāo)點(diǎn)擊時(shí)觸發(fā)。
<title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function copyText() { document.getElementById("field2").value=document.getElementById("field1").value; } </script><body> <p> Field1: <input type="text" id="field1" value="Hello World!"><br> Field2: <input type="text" id="field2"><br><br><button onclick="copyText()">復(fù)制文本</button><p>當(dāng)按鈕被單擊時(shí)觸發(fā)函數(shù)。此函數(shù)把文本從 Field1 復(fù)制到 Field2 中。</p> </body> </html> onclick2:ondblclick ?元素上發(fā)生鼠標(biāo)雙擊時(shí)觸發(fā)。
<title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function copyText() { document.getElementById("field2").value=document.getElementById("field1").value; } </script> </script><body> <!--ondblclick 屬性在鼠標(biāo)雙擊元素時(shí)觸發(fā)。 注釋:ondblclick 屬性不適用以下元素:<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style> 或 <title>。 --> Field1: <input type="text" id="field1" value="Hello World!"><br> Field2: <input type="text" id="field2"><br><br><button ondblclick="copyText()">復(fù)制文本</button><p>當(dāng)按鈕被雙擊時(shí)觸發(fā)函數(shù)。此函數(shù)把文本從 Field1 復(fù)制到 Field2 中。</p></body> </html> ondblclick 元素上發(fā)生鼠標(biāo)雙擊時(shí)觸發(fā)。3:onmousedown 當(dāng)元素上按下鼠標(biāo)按鈕時(shí)觸發(fā)。
? ?onmouseup 當(dāng)在元素上釋放鼠標(biāo)按鈕時(shí)觸發(fā)。
<title>無(wú)標(biāo)題文檔</title> <script type="text/javascript"> function mouseDown() { document.getElementById("p1").style.color="red"; }function mouseUp() { document.getElementById("p1").style.color="green"; } </script><body> <p>onmousedown 屬性在鼠標(biāo)按鈕在元素上按下時(shí)觸發(fā)。</p> <p> 提示:相對(duì)于 onmousedown 事件,onmouseup 事件的事件次序(限于鼠標(biāo)左/中鍵): onmousedown onmouseup onclick</p> <p> 相對(duì)于 onmousedown 事件,onmouseup 事件的事件次序(限于鼠標(biāo)右鍵): onmousedown onmouseup oncontextmenu</p> <!-- 注釋:onmousedown 屬性,onmouseup 屬性不適用以下元素:<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style> 或 <title>。--> <p id="p1" onmousedown="mouseDown()" onmouseup="mouseUp()"> 請(qǐng)點(diǎn)擊文本!mouseDown() 函數(shù)當(dāng)鼠標(biāo)按鈕在段落上被按下時(shí)觸發(fā)。此函數(shù)把文本顏色設(shè)置為紅色。mouseUp() 函數(shù)在鼠標(biāo)按鈕被釋放時(shí)觸發(fā)。mouseUp() 函數(shù)把文本的顏色設(shè)置為綠色。 </p></body> </html> onmousedown/onmouseup4:?onmousemove 當(dāng)鼠標(biāo)指針移動(dòng)到元素上時(shí)觸發(fā)。
? ? ?onmouseout 當(dāng)鼠標(biāo)指針移出元素時(shí)觸發(fā)。
<title>無(wú)標(biāo)題文檔</title><script type="text/javascript"> function bigImg(x) { x.style.height="180px"; x.style.width="180px"; }function normalImg(x) { x.style.height="128px"; x.style.width="128px"; } </script> <body> <h2>onmousemove 屬性在鼠標(biāo)指針移動(dòng)到元素上時(shí)觸發(fā)。</h2> <!-- 注釋:onmousemove 屬性不適用以下元素:<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style> 或 <title>。--> <img onmousemove="bigImg(this)" onmouseout="normalImg(this)" border="0" src="../Pictures/1.JPG" width="128" height="128" alt="Smiley" ><p>函數(shù) bigImg() 在鼠標(biāo)指針移動(dòng)到圖像上時(shí)觸發(fā)。此函數(shù)放大圖像。</p> <p>函數(shù) normalImg() 在鼠標(biāo)指針移出圖像時(shí)觸發(fā)。此函數(shù)把圖像的高度和寬度重置為正常尺寸。</p> </body> </html> onmouseout/onmousemove?
5:onmousemove ?當(dāng)鼠標(biāo)指針在元素上移動(dòng)時(shí)觸發(fā)。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>無(wú)標(biāo)題文檔</title><script type="text/javascript"> function bigImg(x) { x.style.height="180px"; x.style.width="180px"; }function normalImg(x) { x.style.height="128px"; x.style.width="128px"; } </script> <body><!--注釋:onmouse,ove/onmouseout 屬性不適用以下元素:<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style> 或 <title> --> <img onmousemove="bigImg(this)" onmouseout="normalImg(this)" border="0" src="../Pictures/1.JPG" width="100" height="100" alt="Smiley" ><p>函數(shù) bigImg() 在鼠標(biāo)指針移動(dòng)到圖像上時(shí)觸發(fā)。此函數(shù)放大圖像。</p> <p>函數(shù) normalImg() 在鼠標(biāo)指針移出圖像時(shí)觸發(fā)。此函數(shù)把圖像的高度和寬度重置為正常尺寸。</p> </body> </html> onmousmove?
| ondrag | script | 元素被拖動(dòng)時(shí)運(yùn)行的腳本。 |
| ondragend | script | 在拖動(dòng)操作末端運(yùn)行的腳本。 |
| ondragenter | script | 當(dāng)元素元素已被拖動(dòng)到有效拖放區(qū)域時(shí)運(yùn)行的腳本。 |
| ondragleave | script | 當(dāng)元素離開(kāi)有效拖放目標(biāo)時(shí)運(yùn)行的腳本。 |
| ondragover | script | 當(dāng)元素在有效拖放目標(biāo)上正在被拖動(dòng)時(shí)運(yùn)行的腳本。 |
| ondragstart | script | 在拖動(dòng)操作開(kāi)端運(yùn)行的腳本。 |
| ondrop | script | 當(dāng)被拖元素正在被拖放時(shí)運(yùn)行的腳本。 |
| onmousewheel | script | 當(dāng)鼠標(biāo)滾輪正在被滾動(dòng)時(shí)運(yùn)行的腳本。 |
| onscroll | script | 當(dāng)元素滾動(dòng)條被滾動(dòng)時(shí)運(yùn)行的腳本。 |
Media?事件
由媒介(比如視頻、圖像和音頻)觸發(fā)的事件(適用于所有?HTML?元素,但常見(jiàn)于媒介元素中,比如?<audio>、<embed>、<img>、<object>?以及?<video>):
?
?
| 屬性 | 值 | 描述 |
| onabort | script | 在退出時(shí)運(yùn)行的腳本。 |
| oncanplay | script | 當(dāng)文件就緒可以開(kāi)始播放時(shí)運(yùn)行的腳本(緩沖已足夠開(kāi)始時(shí))。 |
| oncanplaythrough | script | 當(dāng)媒介能夠無(wú)需因緩沖而停止即可播放至結(jié)尾時(shí)運(yùn)行的腳本。 |
| ondurationchange | script | 當(dāng)媒介長(zhǎng)度改變時(shí)運(yùn)行的腳本。 |
| onemptied | script | 當(dāng)發(fā)生故障并且文件突然不可用時(shí)運(yùn)行的腳本(比如連接意外斷開(kāi)時(shí))。 |
| onended | script | 當(dāng)媒介已到達(dá)結(jié)尾時(shí)運(yùn)行的腳本(可發(fā)送類似“感謝觀看”之類的消息)。 |
| onerror | script | 當(dāng)在文件加載期間發(fā)生錯(cuò)誤時(shí)運(yùn)行的腳本。 |
| onloadeddata | script | 當(dāng)媒介數(shù)據(jù)已加載時(shí)運(yùn)行的腳本。 |
| onloadedmetadata | script | 當(dāng)元數(shù)據(jù)(比如分辨率和時(shí)長(zhǎng))被加載時(shí)運(yùn)行的腳本。 |
| onloadstart | script | 在文件開(kāi)始加載且未實(shí)際加載任何數(shù)據(jù)前運(yùn)行的腳本。 |
| onpause | script | 當(dāng)媒介被用戶或程序暫停時(shí)運(yùn)行的腳本。 |
| onplay | script | 當(dāng)媒介已就緒可以開(kāi)始播放時(shí)運(yùn)行的腳本。 |
| onplaying | script | 當(dāng)媒介已開(kāi)始播放時(shí)運(yùn)行的腳本。 |
| onprogress | script | 當(dāng)瀏覽器正在獲取媒介數(shù)據(jù)時(shí)運(yùn)行的腳本。 |
| onratechange | script | 每當(dāng)回放速率改變時(shí)運(yùn)行的腳本(比如當(dāng)用戶切換到慢動(dòng)作或快進(jìn)模式)。 |
| onreadystatechange | script | 每當(dāng)就緒狀態(tài)改變時(shí)運(yùn)行的腳本(就緒狀態(tài)監(jiān)測(cè)媒介數(shù)據(jù)的狀態(tài))。 |
| onseeked | script | 當(dāng)?seeking?屬性設(shè)置為?false(指示定位已結(jié)束)時(shí)運(yùn)行的腳本。 |
| onseeking | script | 當(dāng)?seeking?屬性設(shè)置為?true(指示定位是活動(dòng)的)時(shí)運(yùn)行的腳本。 |
| onstalled | script | 在瀏覽器不論何種原因未能取回媒介數(shù)據(jù)時(shí)運(yùn)行的腳本。 |
| onsuspend | script | 在媒介數(shù)據(jù)完全加載之前不論何種原因終止取回媒介數(shù)據(jù)時(shí)運(yùn)行的腳本。 |
| ontimeupdate | script | 當(dāng)播放位置改變時(shí)(比如當(dāng)用戶快進(jìn)到媒介中一個(gè)不同的位置時(shí))運(yùn)行的腳本。 |
| onvolumechange | script | 每當(dāng)音量改變時(shí)(包括將音量設(shè)置為靜音)時(shí)運(yùn)行的腳本。 |
| onwaiting | script | 當(dāng)媒介已停止播放但打算繼續(xù)播放時(shí)(比如當(dāng)媒介暫停已緩沖更多數(shù)據(jù))運(yùn)行腳本 |
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
轉(zhuǎn)載于:https://www.cnblogs.com/9999w/p/4393622.html
總結(jié)
以上是生活随笔為你收集整理的html-----020----事件的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: SOAP简单示例
- 下一篇: WebView三个方法区别(解决乱码问题