通过jquery在Tab键上聚焦到图像按钮不起作用答案

【问题标题】：focus to image button through jquery on Tab key press not working通过jquery在Tab键上聚焦到图像按钮不起作用
【发布时间】：2014-04-21 10:43:27
【问题描述】：

HTML：

<div class="large-9 columns">
  <input type="text" class="txtsearchbox" name="txtsearch" id="txtsearch" placeholder="Search" />
</div>
<div class="large-3 columns">
  <a class="button expand" id="btnsearch1">
  <img src="/Content/Images/search-16x16.png" id="btnsearch" /></a>
</div>

JS：

 $('#txtsearch').on('keydown', function (e) {
        //debugger;
        var keyCode = (window.event) ? e.which : e.keyCode;
        if (keyCode == 9) {
            e.preventDefault();
            $('#btnsearch1').focus();
          //  console.log(e.target.href);
        }
    });

这里我有一个文本框和图像按钮。在 Tab 键上按下焦点没有移动或显示在图像按钮上。我没有得到确切的问题。

【问题讨论】：

标签： javascript jquery focus imagebutton

【解决方案1】：

删除 javascript 并将 tabindex="0" 添加到 "a" 标记。

<div class="large-9 columns">
    <input type="text" class="txtsearchbox" name="txtsearch" id="txtsearch" placeholder="Search" />
</div>
<div class="large-3 columns">
    <a tabindex="0" class="button expand" id="btnsearch1">
        <img src="/Content/Images/search-16x16.png" id="btnsearch" />
    </a>
</div>

【讨论】：