ctrlKeyプロパティは、マウスイベントが発生したときに「Ctrl」キー(コントロールキー)が押されていたかどうかを示す論理値(ブール値、真偽値、真理値)を返すプロパティ。
構文
event.ctrlKey
戻り値
マウスイベントが発生したときに「Ctrl」キー(コントロールキー)が押されていたかどうかを示す論理値(ブール値、真偽値、真理値)を返す。
- マウスイベントが発生したときに「Ctrl」キー(コントロールキー)が押されていた場合、「true」を返す。
- マウスイベントが発生したときに「Ctrl」キー(コントロールキー)が押されていなかった場合、「false」を返す。
サンプル
0
サンプルの動作について
- 「サンプルボタン」ボタンをクリックする度に、ボタンの右横の数値に1を加算する。
- 「Ctrl」キー(コントロールキー)を押しながら「サンプルボタン」ボタンをクリックする度に、ボタンの右横の数値から1を減算する。
サンプルのソースコード
JavaScript
<script type="text/javascript">
window.onload = function () {
document.getElementById( "sampleButton" ).onclick = function( $event ){
sampleFn( $event );
};
}
var $count = 0;
function sampleFn( $event ) {
if( $event.ctrlKey == true ){
document.getElementById( "sampleOutput" ).innerHTML = --$count;
}else{
document.getElementById( "sampleOutput" ).innerHTML = ++$count;
}
}
</script>
window.onload = function () {
document.getElementById( "sampleButton" ).onclick = function( $event ){
sampleFn( $event );
};
}
var $count = 0;
function sampleFn( $event ) {
if( $event.ctrlKey == true ){
document.getElementById( "sampleOutput" ).innerHTML = --$count;
}else{
document.getElementById( "sampleOutput" ).innerHTML = ++$count;
}
}
</script>
HTML
<p>
<button id="sampleButton">サンプルボタン</button>
<span id="sampleOutput" style="margin-left: 10px;">0</span>
</p>
<button id="sampleButton">サンプルボタン</button>
<span id="sampleOutput" style="margin-left: 10px;">0</span>
</p>