Event altKey,ctrlKey,shiftKey屬性解析
event.altKey
功能：檢測事件發(fā)生時(shí)Alt鍵是否被按住了。
語法：event.altKey
取值：true | false
說明：
altKey屬性為true表示事件發(fā)生時(shí)Alt鍵被按下并保持，為false則Alt鍵沒有按下。
altKey屬性可結(jié)合鼠標(biāo)或鍵盤使用，多用于制作一些快捷操作方式。
event.ctrlKey
功能：檢測事件發(fā)生時(shí)Ctrl鍵是否被按住了。
語法：event.ctrlKey
取值：true | false
說明：
ctrlKey屬性為true表示事件發(fā)生時(shí)Ctrl鍵被按下并保持，為false則Ctrl鍵沒有按下。
ctrlKey屬性可結(jié)合鼠標(biāo)或鍵盤使用，多用于制作一些快捷操作方式。
event.shiftKey
功能：檢測事件發(fā)生時(shí)Shift鍵是否被按住了。
語法：event.shiftKey
取值：true | false
說明：
shiftKey屬性為true表示事件發(fā)生時(shí)Shift鍵被按下并保持，為false則Shift鍵沒有按下。
shiftKey屬性可結(jié)合鼠標(biāo)或鍵盤使用，多用于制作一些快捷操作方式。
實(shí)例1
組合操作示例。
<input id="txt1" type="text" value="Hello World!" onclick="checkAlt(event)" />
<script type="text/javascript">
function checkAlt(oEvent)
{
if( oEvent.altKey )
document.getElementById("txt1").select();
}
</script>
這段代碼的效果為：
如果按住Alt鍵再單擊上面的文本框，可以選中文本框中的文本。
實(shí)例2
組合操作示例。
<input id="txt2" type="text" value="Hello World!" onclick="clearText(event)" />
<script type="text/javascript">
function clearText(oEvent)
{
if( oEvent.ctrlKey && oEvent.keyCode==46 )
document.getElementById("txt2").value = "";
}
</script>
這段代碼的效果為：
使用"Ctrl+Del"組合鍵可清除上面的文本框的內(nèi)容。（必須先使文本框獲得焦點(diǎn)。本例只適用于IE瀏覽器。）
實(shí)例3
組合操作示例。
<div id="box" style="width:50px; height:25px;border:1px solid black; background-color:red" onclick="setColor(event)"></div>
<script type="text/javascript">
var b = true;
function setColor(oEvent)
{
if( oEvent.shiftKey && b )
document.getElementById("box").style.backgroundColor = "blue";
if( oEvent.shiftKey && !b )
document.getElementById("box").style.backgroundColor = "red";
b = !b;
}
</script>
這段代碼的效果為：
按住"Shift"鍵并用鼠標(biāo)點(diǎn)擊上面的色塊，可改變色塊顏色
- JavaScript Event學(xué)習(xí)第七章 事件屬性
- javascript attachEvent綁定多個(gè)事件執(zhí)行順序問題
- Javascript中的window.event.keyCode使用介紹
- myEvent.js javascript跨瀏覽器事件框架
- javascript開發(fā)隨筆一 preventDefault的必要
- javascript中window.event事件用法詳解
- JavaScript事件處理器中的event參數(shù)使用介紹
- Javascript中Event屬性搜集整理
- javascript Event對象詳解及使用示例
- 21個(gè)JavaScript事件(Events)屬性匯總
- javascript中的altKey 和 Event屬性大全
相關(guān)文章
js控制當(dāng)再次點(diǎn)擊按鈕時(shí)的間隔時(shí)間
這篇文章主要介紹通過js如何控制當(dāng)再次點(diǎn)擊按鈕是的間隔時(shí)間,需要的朋友可以參考下2014-06-06
這篇文章主要介紹了微信小程序之事件交互操作,結(jié)合實(shí)例形式分析了微信小程序事件響應(yīng)、交互及界面布局等相關(guān)操作技巧與注意事項(xiàng),需要的朋友可以參考下2018-12-12
Javascript里使用Dom操作Xml...2006-09-09
input有個(gè)focus方法，今天發(fā)現(xiàn)就在onblur事件里面起作用，onchang等事件中根本不起作用的2010-03-03
利用Print.js實(shí)現(xiàn)打印pdf、HTML及圖片(可設(shè)置樣式可分頁)
在我們需要在頁面中打印某個(gè)區(qū)域的內(nèi)容或者生成pdf的時(shí)候,我們可以直接用printJs庫,這篇文章主要給大家介紹了關(guān)于利用Print.js實(shí)現(xiàn)打印pdf、HTML及圖片的相關(guān)資料,可設(shè)置樣式可分頁,需要的朋友可以參考下2024-05-05
JavaScript中for循環(huán)的幾種寫法與效率總結(jié)
每個(gè)接觸JS的開發(fā)人員都不可避免的與for循環(huán)打交道，畢竟這是遍歷必不可少的工具之一。然而當(dāng)循環(huán)次數(shù)比較大時(shí)，效率問題必須重視。下面這篇文章就主要介紹了JavaScript中幾種for循環(huán)的寫法與效率,需要的朋友可以參考借鑒，下面來一起看看吧。2017-02-02
這篇文章主要介紹了在JavaScript中分解數(shù)字的三種方法,本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-01-01
JS創(chuàng)建或填充任意長度數(shù)組的小技巧匯總
在JavaScript 中,我們往往會遇到需要使用某些默認(rèn)值來填充數(shù)組的情況,那么都有哪些方式可以完成這樣的任務(wù)呢?這篇文章主要給大家介紹了關(guān)于JS創(chuàng)建或填充任意長度數(shù)組的小技巧,需要的朋友可以參考下2021-10-10
這篇文章主要介紹了JS如何實(shí)現(xiàn)在彈出窗口中加載頁面,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-12-12
javascript如何實(shí)現(xiàn)create方法
這篇文章主要介紹了javascript如何實(shí)現(xiàn)create方法,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-11-11