Javascript 避免所有鼠标悬停，焦点突出显示CSS/jQuery

我有一个要求，我将避免只鼠标悬停在表格的行上

是否，当我使用

选项卡

键浏览行时，突出显示应在那里

<table>
   <tr><td>Row1</td></tr>
   <tr><td>Row1</td></tr>
   <tr><td>Row1</td></tr>
</table>

JS fiddle链接是

---

鼠标上方不应出现突出显示，但应在使用TAB时出现。

使用

：焦点

与设置行上的

tabindex

属性相结合应能达到此目的。我在这里放了一把小提琴：

编辑

您可以使用一点jQuery来阻止行的默认浏览器操作

mousedown

，以防止鼠标操作高亮显示：

$('tr').on("mousedown", function(event) {
  event.preventDefault();
});

---

更新了这里的Fiddle:

使用

：焦点

与设置行上的

tabindex

属性相结合应该可以实现这一点。我在这里放了一把小提琴：

编辑

您可以使用一点jQuery来阻止行的默认浏览器操作

mousedown

，以防止鼠标操作高亮显示：

$('tr').on("mousedown", function(event) {
  event.preventDefault();
});

---

这里更新了Fiddle:

为什么不尝试使用jquery而不是简单的Css呢？ 像这样的

$("tr").keydown(function (e) {    
  if (e.which == 9) {     
    $(this).css(" background","yellow");
    e.preventDefault();
  }
});

---

请告诉我它是否有效。

为什么不尝试使用jquery而不是简单的Css？ 像这样的

$("tr").keydown(function (e) {    
  if (e.which == 9) {     
    $(this).css(" background","yellow");
    e.preventDefault();
  }
});

---

请告诉我它是否有效。

这里是一个纯HTML/CSS示例。您只需使用

指针事件：无

属性，然后在

:focus

而不是

:hover

上设置行的样式

这里有两个例子：

• 第一个选项将允许您单击或通过选项卡查看选项
• 第二个将只允许您通过标签浏览它们

---

这里是一个纯HTML/CSS示例。您只需使用

指针事件：无

属性，然后在

:focus

而不是

:hover

上设置行的样式

这里有两个例子：

• 第一个选项将允许您单击或通过选项卡查看选项
• 第二个将只允许您通过标签浏览它们

---

tabindex不是首选项：）我点击行，然后我就能看到highlightSure，因为用鼠标点击一个元素会使它聚焦。您的需求提到，行不应在

鼠标上方突出显示，这将由
：hover
样式规则控制。您的意思是说您的需求不允许任何鼠标驱动的交互显示突出显示样式吗。。不应有鼠标驱动的高光，，，，只有tab highlightstabindex不可取：）我点击行，然后我就能看到highlightSure，因为用鼠标点击一个元素会使它聚焦。您的需求提到，行不应在
鼠标上方突出显示，这将由
：hover
样式规则控制。您的意思是说您的需求不允许任何鼠标驱动的交互显示突出显示样式吗。。没有鼠标驱动的高亮显示，，，，，只有选项卡高亮显示我没有使用过的查询，因为我不太确定这是要处理的交叉浏览器事件还是没有使用过的查询，因为我不太确定这是要处理的交叉浏览器事件还是没有很好地处理
指针事件
！：）不过需要注意的是：IE10或更早版本不支持CSS属性。好的但不是首选的指针事件帮助处理
指针事件
！：）不过需要注意的是：IE10或更早版本不支持CSS属性。良好但不是首选的指针事件