1

キーボードのスクロールと順序付けられていないリストアイテムの選択を可能にするはずの次のチュートリアルに従いました->チュートリアル

説明されているように、提案ボックスと一緒に使用しています->提案ボックス

IDと名前の変更を除いて、私はこれらの両方のTUTを手紙に従わせたことに注意してください。

動作しているように見えますが（ホバー効果をキーダウンすると表示されます）、キーを離すとすぐに消えます。下矢印を押したままにすると、リストの一番下までスクロールしますが、キーを離すとすぐにホバー効果が消えます。JQueryは決して私の強力なスイートではないので、何が間違っているのかよくわかりません。チュートリアルで説明されているとおりにコードを使用しています。#menuを#suggestionsに変更しただけです。これは、私のdivの名前です。

ただし、コードは次のとおりです。

   var currentSelection = 0;
var currentUrl = '';

google.load("jquery", "1.3.1");
google.setOnLoadCallback(function()
{
    // Register keypress events on the whole document
    $(document).keypress(function(e) {
        switch(e.keyCode) { 
            // User pressed "up" arrow
            case 38:
                navigate('up');
            break;
            // User pressed "down" arrow
            case 40:
                navigate('down');
            break;
            // User pressed "enter"
            case 13:
                if(currentUrl != '') {
                    window.location = currentUrl;
                }
            break;
        }
    });

    // Add data to let the hover know which index they have
    for(var i = 0; i < $("#suggestions ul li a").size(); i++) {
        $("#suggestions ul li a").eq(i).data("number", i);
    }

    // Simulote the "hover" effect with the mouse
    $("#suggestions ul li a").hover(
        function () {
            currentSelection = $(this).data("number");
            setSelected(currentSelection);
        }, function() {
            $("#suggestions ul li a").removeClass("itemhover");
            currentUrl = '';
        }
    );
});

function navigate(direction) {
    // Check if any of the menu items is selected
    if($("#suggestions ul li .itemhover").size() == 0) {
        currentSelection = -1;
    }

    if(direction == 'up' && currentSelection != -1) {
        if(currentSelection != 0) {
            currentSelection--;
        }
    } else if (direction == 'down') {
        if(currentSelection != $("#suggestions ul li").size() -1) {
            currentSelection++;
        }
    }
    setSelected(currentSelection);
}

function setSelected(menuitem) {
    $("#suggestions ul li a").removeClass("itemhover");
    $("#suggestions ul li a").eq(menuitem).addClass("itemhover");
    currentUrl = $("#suggestions ul li a").eq(menuitem).attr("href");
}

誰かがこの問題で私を助けてくれるでしょうか？

4

1 に答える 1

1

このプラグインhttp://plugins.jquery.com/keyscroll/を試すことができ、リストを上下にスクロールできます

于 2013-02-14T17:50:11.400 に答える