html表格中不可选择的文本？答案

【问题标题】：Non selectable text in html table?html表格中不可选择的文本？
【发布时间】：2011-01-12 04:58:26
【问题描述】：

问题：我滥用表格作为按钮列表，甚至在每个单元格上都使用 onclick。
问题是，这些按钮是缩放按钮，并且在重复单击太快（双击）时，您选择了按钮（=表格单元格）文本（即使您不想这样做），这看起来很奇怪。
我可以把它关掉吗？我可以使表格中的文本不可选吗？

【问题讨论】：

标签： asp.net javascript html css

【解决方案1】：

要回答您的原始问题...要防止用户突出显示页面上的文本，请应用以下 CSS 规则：

-moz-用户选择：无； -khtml-用户选择：无；用户选择：无；

【讨论】：

【解决方案2】：

是的，如果你把它做成一个合适的按钮。您可以像设置表格单元格样式一样设置按钮样式：

.button {
 background-color:blue;
 color:red;
 border:4px solid green;
}

<input type="button" class="button" value="MyButton" />

如果你愿意，你仍然可以把它放在一张桌子上（悔改，罪人！），但至少让一个按钮成为一个按钮。 ;)

如果希望它自动填充表格单元格的宽度，请将按钮设置为display:block;

【讨论】：

【解决方案3】：

添加

style="user-select: none; -moz-user-select: none; -khtml-user-select: none;"    onselectstart="javascript:return false;"

到你的桌子应该可以解决问题

<table id="TableUnselectableExample" style="width: 100%; user-select: none; -moz-user-select: none; -khtml-user-select: none;" onselectstart="javascript:return false;">

所以它是此处提供的解决方案的组合（适用于 IE 和 FF）

【讨论】：

【解决方案4】：

抱歉，不再相关。

我按照css的方式进行了搜索。但我发现最好的是
http://www.tek-tips.com/viewthread.cfm?qid=1184318&page=1

原来我实际上需要添加一个 JS 事件处理程序：

onselectstart="javascript: return(false);"

以上适用于 IE 和 Chrome。但是，你仍然需要为 FireCrap 翻译它：

onselectstart="return false;"
onmousedown="if (typeof event.preventDefault != 'undefined') {event.preventDefault();}"

【讨论】：

不要使用javascript: 启动事件处理程序，您会将其与href 属性中的用法混淆。这会将以下语句分配给 IE 中名为“javascript”的标签，与onselectstart="blahblahblah: return(false);" 基本相同。这可能会在其他浏览器中引发错误。

【解决方案5】：

您可以在触发 onclick 事件时将焦点设置在 TD 上。
这是一个带有 DIV 的示例，但同样适用于 TD。

<div onclick="clicked(this);">clicks:</div>
<script>
function clicked(div){
    div.innerHTML += '*';
    div.focus();
}
</script>

【讨论】：

【解决方案6】：

我推荐<button> 标签。在这里阅读：http://www.w3schools.com/tags/tag_button.asp

【讨论】：