1

.keyup(e)上下の矢印にa を付けようとしています。Firefox では正常に動作しますが、Safari では動作しません。他のすべての矢印は Safari で正常に機能します。

$(document.documentElement).keyup(function (event) {

        if (event.keyCode == 37) 
        {
        // go left
            $('.left').click();
        } 
        else if (event.keyCode == 39) 
        {
        // go right
            $('.right').click();
        }
        else if (event.keyCode == 38) 
        {
        // next project
            $('a.up div.arrow').click();
        }
        else if (event.keyCode == 40) 
        {
        // previous project
            $('a.down div.arrow').click();
        }
        else if (event.keyCode == 32) 
        {
        // info
            $('aside').click();
        }
    });

編集: 私のウェブサイトの動作デモへのリンク — http://www.ryan-neil.com

もっと早く追加すればよかった…

4

2 に答える 2

2

動作中のデモはこちらでお試しください私はOSXlionsafariを使用しており、動作します：http: //jsfiddle.net/DRgRv/1/

したがって、灰色のボックスをクリックしてから、上下の矢印キーを使用してナビゲートします。

これが役に立ったら、投票して受け入れることを忘れないでください。

コード

$(document).keyup(function(e) {
    switch (e.which) {
    case 37:
        $('div').stop().animate({
            left: '-=10'
        }); //left arrow key
        break;
    case 38:
        $('div').stop().animate({
            top: '-=10'
        }); //up arrow key
        break;
    case 39:
        $('div').stop().animate({
            left: '+=10'
        }); //right arrow key
        break;
    case 40:
        $('div').stop().animate({
            top: '+=10'
        }); //bottom arrow key
        break;
    }
})​
于 2012-05-24T08:41:49.263 に答える
1

使用しているサファリのバージョン

jquery のサポートブラウザの互換性について

jQuery は、次のブラウザーを積極的にサポートしています。

Firefox Current - 1 version
Internet Explorer 6+
Safari Current - 1 version
Opera Current - 1 version
Chrome Current - 1 version

それらの問題は、jQuery のバグと見なして報告する必要があります。

次の既知の問題があります。

Mozilla Firefox 1.0.x
Internet Explorer 1.0-5.x
Safari 1.0-2.0.1
Opera 1.0-9.x
Konqueror

jQuery は通常、Konqueror および Firefox 1.0.x で動作しますが、定期的にテストしていないため、予期しないバグが発生する可能性があります。

キーイベントをテストできます

ここでテストしてみてください

またはここ

あなたはまだこのようにハッキングを試すことができます スタックオーバーフローの別の投稿から

キープレスは紛らわしいイベントです。keydown と keyup は、キーボードの特定のキーが押されているか、元に戻ったかを通知しますが、 keypress イベントは、画面に表示される文字を通知することになっているため、参照した jquery ドキュメントには次のように記載されています。

For example, a lowercase "a" will be reported as 65 by keydown and keyup, but as 97 by keypress.

さらに悪いことに、Safari は、画面に何かを書き込まないものに対してキー押下イベントをトリガーしません。そのため、矢印キーは機能しません。ただし、Firefox は矢印キーのキー押下イベントをトリガーします。どちらも仕様の合理的な実装であるため、どちらも変更されるとは思わないでください。そのため、キーダウンまたはキーアップに固執するという提案がありました。

ただし、キーが押されたときに (Firefox で) keypress イベントがどのように繰り返されるかを利用したいようで、これを矢印キーで実行したいと考えています。その場合は、keydown と keypress の両方を見るハンドラーを作成する必要があります。ブラウザが矢印キーを押したときに反応する 2 つの異なる方法を次に示します。

*Firefoxはキーダウン イベントを登録し、キー押下イベントも繰り返します (注: キーを 1 回押すだけで、キーダウン イベントとキー押下イベントの両方が登録されます)。

*Safariはキーダウン イベントを登録し、キーダウン イベントを繰り返す 矢印キーに対して適切に機能させ、キーの繰り返しを機能させる簡単なハックは次のとおりです。

function moveItem(evt) {
    // do something with `this` and evt.keyCode here...
}

$(document.documentElement)
    .keypress(function(evt) {
        if ($.data(this, '_lastKeyEvent') != 'keydown') {
            // since firefox will do both a keydown and a keypress for the first
            // keydown, we ignore the very first keypress
            moveItem.call(this, evt);
        }
        $.data(this, '_lastKeyEvent', 'keypress');
    })
    .keydown(function(evt) {
        moveItem.call(this, evt);
        $.data(this, '_lastKeyEvent', 'keydown');
    });
于 2012-05-24T08:35:53.593 に答える