点击列表符号时禁用列表项的高亮显示

Question

我有一个简单的列表：例如：http://www.w3schools.com/html/html_lists.asp 我正在使用Mozilla Firefox（版本为3.6，但我认为版本并不重要）。当我单击项目符号时，列表项会被选中（高亮显示）。

有没有一种方法可以禁用此突出显示（而不是永久使用-moz-selection删除突出显示）？

在Chrome或IE中看不到这种行为。 另一个示例：（使用list-style-image）：http://www.sendesignz.com/Demo/jQuery/expanding_list_item/expanding.html 是否有一种在纯JavaScript或jQuery或CSS中禁用FF中此自动选择的方法？

- TJ-

---

这篇文章可能会有所帮助：http://forums.digitalpoint.com/showthread.php?t=848814 - xkeshav

https://dev59.com/fnVD5IYBdhLWcg3wJIIK - mplungjan

Answer 1

你可以使用Mozilla CSS参数。

CSS。

 li {-moz-user-select: none;}

- barney

Answer 2

这是Firefox实现的功能，虽然我不知道真正删除此功能的方法，但有一个CSS解决方案。

将<li>标签中的所有内容用<span>标签包裹起来，然后使用margin、padding和absolute positioning将标签定位在列表项上方。

HTML

<ul>
<li><span>Item</span></li>
<li><span>Item</span></li>
</ul>

CSS

li span{
    margin-left: -50px;
    padding-left: 50px;
    position: absolute;
}

- Andre Backlund

Answer 3

这个选择似乎与mousedown事件有关。您可以通过停止事件来阻止它。例如在jQuery中：

elt.mousedown(function(event){ return false; });

- goulagman

---

你应该考虑在你的函数中添加 if (event && event.preventDefault) event.preventDefault();。 - S. Albano