6

ユーザーがシフト(キーダウン)を押すと現在透明になり、シフトキーが上がるリスナーをバインドするテキスト入力があります

すなわち。

$('#foo').keydown(function(){
      if(event.which==16){
          //make #foo transparent
          $(this).keyup(function(){
              if(event.which==16){
                 //return #foo to its former glory
                 $(this).unbind('keyup');
              }
          });
       };
  })

これは、シフト キーを押してから離すまでの間に文字が押されていない場合に正常に機能します。問題は、Shift キーを押しながら別の文字を押すと、Shift キーが完全に忘れられているように見えることです。Shift キーを離すと、キーアップは発生しません。

プロパティを16に設定して「偽の」キーダウンをトリガーして、.which他の文字が押された後に正しい方向に微調整しようとしましたが、役に立ちませんでした。

どんな提案でも大歓迎です!

4

1 に答える 1

1

を押している間、それを離すまでshift継続的にイベントをトリガーするため、この例では、トリガーされたイベントと同じ数のハンドラーをバインドします。これにより、あらゆる種類の奇妙な問題が発生する可能性が高くなります。keydownkeyupkeydown

代わりに、 と の両方keydownkeyup同じハンドラーにバインドし、そこで魔法をかけます。

$("#foo").on("keydown keyup", function (e) {
    if (e.which === 16) {
        if (e.type === "keydown") {
            // make #foo transparent
        } else {
            // return #foo to its former glory
        }
    }
});

jsFiddle のテスト ケースを参照してください。

ただし、押している間に入力のフォーカスを失ってshift離すと、期待どおりに動作しません。windowそれを解決する 1 つの方法は、代わりにバインドすることです。

var $foo = $("#foo");
var shiftPressed = false;

$(window).on("keydown keyup", function (e) {
    if (e.which === 16) {
        shiftPressed = e.type === "keydown";
        if (shiftPressed && e.target === $foo[0]) {
            $foo.addClass("transparent");
        } else {
            $foo.removeClass("transparent");
        }
    }
});

$foo.on("focus blur", function (e) {
    if (e.type === "focus" && shiftPressed) {
        $foo.addClass("transparent");
    } else {
        $foo.removeClass("transparent");
    }
});

jsFiddle のテスト ケースを参照してください。

于 2013-07-03T21:35:50.223 に答える