0

div入力すると表示される検索候補がkeyUpあります。これは問題なく動作しますが、現在、キーボードショートカットを実行しようとしています。

downキーボードの矢印ボタンをクリックするspanとaが選択され、選択された後の別のボタンが選択されるような動作が必要spanです。同様に、up矢印をクリックすると上向きspanが選択され、クリックするenterとリンクが開きます。

a：hoverを削除できず、クラスを追加できなかったため、スタックしました。基本的にどうしたらいいのかわからなくなった後も。しかし、私は本当に一生懸命に努力しました。

これがjsfiddleリンクです（フィールドに何かを入力してください）。多分誰かが私を助けてくれるでしょう。

4

1 に答える 1

1

このコードは、リクエストが行われ、データが返されるときに実行する必要があります。

<script type="text/javascript">
    $(document).ready(function(){
        total = 3;
        $(".result-item").mouseenter(
            function(){
                hovered = $(this).attr("id");
                total = 3;

                $(".result-item").each(function(){
                    $(this).children("a").css({
                        'background-color':'#e4e4e4',
                        'color':'#000000'
                    });

                    $(this).find(".searchheading").css({
                            'color':'#191919'
                        });

                    $(this).find(".searchcaption").css({
                        'color':'#555555'
                    });
                });

                $(this).children("a").css({
                    'background-color':'#b7b7b7',
                    'color':'#ffffff'
                });

                $(this).find(".searchheading").css({
                    'color':'#ffffff'
                });

                $(this).find(".searchcaption").css({
                    'color':'#f1f1f1'
                });
            }
        );

    });
</script>

そして、リクエストが行われるページのこのコード：

$("#suggestions").hide();

                $("#search").bind('keyup', function(event){
                    if (event.which == 40 || event.which == 38 || event.which == 13) return false;
                    else
                    {
                        hovered = undefined;
                        lookup($(this).val());
                    }
                });


                $("#search").bind('keydown', 'down', function(evt){
                    if ($("#suggestions").is(":visible"))
                    {
                        if (typeof hovered == 'undefined')
                        {
                            $("#result-item-0").trigger("mouseenter");
                            return;
                        }

                        count = parseInt($("#"+hovered).attr("count"));
                        next = (count + 1);

                        if (next == total)
                            next = 0;

                        $("#result-item-"+next).trigger("mouseenter");
                    }
                });

                $("#search").bind('keydown', 'up', function(evt){
                    if ($("#suggestions").is(":visible"))
                    {
                        if (typeof hovered == 'undefined')
                        {
                            $("#result-item-"+(total-1)).trigger("mouseenter");
                            return;
                        }

                        count = parseInt($("#"+hovered).attr("count"));
                        prev = (count - 1);

                        if (prev == -1)
                            prev = (total-1);

                        $("#result-item-"+prev).trigger("mouseenter");
                    }
                });

                $("#search").bind('keydown', 'return', function(evt){
                    if ($("#suggestions").is(":visible"))
                    {
                        if (typeof hovered == 'undefined')
                        {
                            str = $("#search").val();
                            window.location.href = urlencode(str); // urlencode is a custom function
                            return false;
                        }

                        count = parseInt($("#"+hovered).attr("count"));
                        current = count;
                        $("#result-item-"+current).trigger("mouseenter");

                        $("#suggestions").fadeOut();
                        window.location.href = $("#"+hovered).children("a").attr("href");
                    }
                });

            })

;

また、要素の属性を削除onkeyup=""しました。このアプローチの方が優れています。

于 2013-01-11T13:01:10.020 に答える