javascript - 矢印キーを使用して要素をナビゲートする方法は? (およびそれらを強調表示する)

Question

私はopenerp (オープン ソースの erp ソリューション) のキーボード サポートを独自に開発しており、これまでのところ作業は完了しています。しかし、どうやっても解決できない最後の部分があります。課題は、矢印によるナビゲーションを作成し、現在表示されているオブジェクトを強調表示することです。理解を深めるために、xml の構造を次に示します。ユーザーがどの製品に焦点を当てているかを確実に把握したいと考えています。

<t t-name="ScaleScreenWidget">
     "<div class="scale-screen screen">
 >           <header><h2>Product Weighting</h2></header>
        <div class="display">
            <span class="weight">
                <p>
                    <t t-esc="widget.get_product_weight().toFixed(3)" />
                    Kg
                </p>
            </span>
            <span class="product-name" >
                <t t-esc="widget.get_product_name()" />
            </span>
            <div class="product-picture">
                <span class="product-price">
                    <t t-esc="widget.format_currency(widget.get_product_price()) + '/Kg'" />
                </span> 
                <t t-if="widget.get_product()">
                    <img t-att-src="widget.get_product().get_image_url()" />
                </t>
            </div>
        </div>
    </div>
</t>

私は怠け者ではなく、この質問に対する解決策を見つけるために心を込めて試みましたが、できませんでした。タッチスクリーン ハードウェアを購入する余裕はありません。前もって感謝します。