本站電子書

您可以在這些電子書店找到本站電子書: Google Play 圖書iBooks StoreHyReadReadmooPubu
===>>>本站推出學習遊戲意見調查<<<===《如何自學程式設計》入選 Google Play 台灣地區2016年度最佳書籍

HTML DOM 快速導覽 - 事件物件 event 的屬性 defaultPrevented

event.defaultPrevented 回傳 defaultPrevented 的設定值,其為 truefalse



若為 true ,即抑制事件的預設發生情況, false 則不會抑制事件的預設發生情況。


舉例如下
function init(event) {
    show(event);
}

function show(event) {
    var s1 = document.getElementById("show1");
    s1.innerHTML = event.defaultPrevented;
    var s2 = document.getElementById("show2");
    s2.innerHTML = event.cancelable;
}

function preventDef(event) {
    event.preventDefault();
    show(event);
}

function run1(event) {
    var t = document.getElementById("checkbox");
    t.addEventListener("click", preventDef, false);
}

function run2(event) {
    var t = document.getElementById("checkbox");
    t.removeEventListener("click", preventDef, false);
    show(event);
}

/* 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名:event005.js
     功能:示範 JavaScript 程式 
     作者:張凱慶
     時間:西元 2011 年 8 月 */


此例將 defaultPrevented 的真假值交給 id 屬性 (attribute) 為 show1 的元素 (element) 顯示
var s1 = document.getElementById("show1");
s1.innerHTML = event.defaultPrevented;


我們以下面的 HTML 文件載入
<!DOCTYPE html>
<html>
<head>
<title>HTML DOM DEMO</title>
<script src="event005.js" type="text/javascript"></script>
</head>
<body onload="init(event);">
<table><tr><td><input type="checkbox" id="checkbox"/>
<label for="checkbox">Checkbox</label></td><tr>
<tr><td>
<input type="button" value="Prevent" onclick="run1(event);">
</td><tr>
<tr><td>
<input type="button" value="Cancel" onclick="run2(event);">
</td><tr></table>
<div>defaultPrevented: <span id="show1"></show></div>
<div>cancelable: <span id="show2"></show></div>
</body>
</html>

<!-- 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名:event005.html
     功能:示範 JavaScript 程式 
     作者:張凱慶
     時間:西元 2011 年 8 月 -->


瀏覽器 (broswer) 開啟, defaultPrevented 預設為 false



此時 Checkbox 的核取方塊可以自由選取,若是點擊 Prevent 按鈕,就無法選取 Checkbox ,因為 defaultPrevented 已經變成 true



中英文術語對照
屬性element
元素element
瀏覽器broswer


您可以繼續參考
事件物件 event


相關目錄
HTML DOM 快速導覽
JavaScript 教材
首頁


參考資料
https://developer.mozilla.org/en/DOM/event.defaultPrevented

沒有留言: