jQuery の click や keypress のイベント
以下のようなHTMLがあった場合の マウスクリックやキー入力のイベントの取得方法をいくつかメモします。
html
<html>
<body>
<div id="left_view">
LEFT側
<textarea id="txt1">あいうえお</textarea>
</div>
<div id="right_view">
RIGHT側
<textarea id="txt2">かきくけこ</textarea>
</div>
</body>
</html>
LEFT側のなにがしかをクリックしたり入力しようとしたりした場合に alert() が発動します。
javascript
$( function()
{
$('#left_view').click(function() {
alert('xxx');
}) ;
//
$("#left_view").keypress(function (e) {
alert('xxx');
});
});
LEFT・RIGTH関係なく、textarea をクリックしたり入力しようとしたりした場合に alert() が発動します。
javascript
$( function()
{
$('textarea').click(function() {
alert('xxx');
}) ;
//
$("textarea").keypress(function (e) {
alert('xxx');
});
});
id="txt1" のもの(LEFT側のtextarea) をクリックしたり入力しようとしたりした場合に alert() が発動します。
javascript
$( function()
{
$('#txt1').click(function() {
alert('xxx');
}) ;
//
$("#txt1").keypress(function (e) {
alert('xxx');
});
});
画面のどこかがクリックされた場合に alert() が発動します。
$( function()
{
$(document).click(function(e) {
alert('xxx');
}) ;
});
textarea以外の 画面のどこかがクリックされた場合に alert() が発動します。
$(document).click(function(e) {
if(!$(e.target).closest('textarea').length) {
alert('xxx');
}
}) ;
Ctrl+S を押したときにalert() が発動します。
$(window).bind('keydown', function(e) {
if (e.ctrlKey || e.metaKey) {
switch (String.fromCharCode(e.which).toLowerCase()) {
case 's':
e.preventDefault();
alert('xxx');
break;
}
}
});
編集する
