禁用div内容错误

Question

我可以使用下面的命令禁用div的内容

<div style='-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
' onselectstart='return false;'>

我的div中有两个内容，第一个是

<input>

另一个是

<textarea>

当我拖动鼠标时，两者都不能被选中。但是当我右击+全选的时候。我可以选择文本框的内容，但不能选择输入框。

注意:我使用了一个openWYSIWYG编辑器来编辑我的文本区域，我也试着把透明的div放在顶部，但得到了同样的结果。

问题是，我如何才能完全禁用选择？

Answer 1

禁用表单元素的正确方法是在JavaScript的帮助下设置它的disabled="disabled"标志。这种方法效果很好。

您不能为div元素添加此属性，但您可以通过使用如下CSS代码将所选文本的颜色设置为与div的背景相同，从而模拟禁用元素的行为。

::selection {
background: #xxxxxx;
}
::-moz-selection {
background: #xxxxxx;
}

其中div是#xxxxxx元素的background-color。

Answer 2

CSS user-select-attribute上没有标准行为。因此，在Safari中，“全选”选项或者只是选择周围的元素，仍然会选择你所经历过的- as之间的内容。

下面是更多信息："css-tricks.com: User-Select“

请注意，此CSS不会阻止用户查看页面的源代码并从那里复制内容。正如Chris所说的，更多的是为了不意外地选择内容。