1

私は、異なる個々のキープレスで CSS が切り替えられる 2 つの div を持つプロジェクトを構築しています。

私はこのjQueryライブラリを使用しています: https://github.com/jeresig/jquery.hotkeys/

ここで簡単なデモを見ることができます: http://lazarogamio.com/projects/key_test/

ここに私のHTMLがあります:

<div class="test_box" id="red"></div>

<div class="test_box" id="green"></div>

私のCSS：

.test_box {
width: 200px;
height: 200px;
border: 2px solid #000;
margin: 20px;
float: left;
}

.red {
background-color: red;
}

.green {
background-color: green;
}

そして私のjQuery：

function keymap(){

$(document).bind('keydown', 'r', function (evt){
    $('#red').toggleClass('red');
    });

$(document).bind('keydown', 'g', function (evt){
    $('#green').toggleClass('green');
    });
};

$(document).ready(keymap);

現時点では、keydown イベントは機能していますが、すべてのキーと両方の div に対してです。私は元々、各 div を個別の関数で制御していましたが、結果は同じでした。また、他のキーを何もしないようにマッピングしようとしましたが、役に立ちませんでした。私の推測では、キーを適切にターゲットにしていないか、関数を正しいオブジェクトにバインドしていないのでしょうか?

4

1 に答える 1

1

jQueryを含めるhotkeys 前に含めます。それは逆である必要があります。keydown現在、通常のようにバインドしているだけで、hotkeysインクルードは効果がありません。

最初にjQueryを含めると、期待どおりに機能するはずです。

http://jsfiddle.net/ExplosionPIlls/GGvrd/

于 2013-02-07T01:14:44.657 に答える