5

可能重复：
有没有办法使 DIV 不可选择？

我已经看到了许多适用于元素的解决方案。但是我有一个带有标签和按钮的区域。它不仅仅是一个元素，它是 a 中的每个元素DIV。

我怎样才能使其中包含的任何内容无法DIV选择？请注意，我不能只在上面放置一个遮罩层，DIV因为DIV有我需要能够单击的按钮。

4

3 回答 3

5 
$(".yourdiv").children().css({userSelect: 'none'});

如果您想使用 CSSuser-select属性禁用选择。如果不是，上面可以很容易地推广到其他方法。

以上只选择直接子代，要选择所有后代，使用.find()方法：

$(".yourdiv").find("*").css({userSelect: 'none'});

你也可以使用纯 CSS 来做到这一点：

.yourdiv * { /*this selects all elements that are children of yourdiv*/
    /*user-select: none rules*/
}

或者：

.yourdiv > * { /*this selects all elements that are direct descendants of yourdiv*/
    /*user-select: none rules*/
}
于 2012-10-07T14:15:33.370 回答
1

CSS：

div.unselectable {
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    user-select: none;
}

HTML：

<div id="foo" class="unselectable">...</div>

参考：

于 2012-10-07T14:20:49.897 回答
1

user-select所有支持它们的浏览器都继承了专有的CSS 变体。看这个例子：

http://jsfiddle.net/yD7bM/

您的问题是不支持这些 CSS 属性的浏览器，即 Opera 和 IE <= 9。令人高兴的是，它们都实现了一个替代方案：unselectable属性。但是，不是继承的就是这个属性。

最好的解决方案是unselectable="on"在您需要在 HTML 中不可选择的每个元素上放置一个属性（即在服务器端进行）。但是，如果这不是一个选项，您可以使用 JavaScript 使用递归函数来实现。

如果您使用的是 jQuery，您可以执行以下操作以将unselectable属性添加到每个具有类“不可选择”的元素及其所有后代：

 $(".unselectable").find("*").andSelf().attr("unselectable", "on");

演示：http: //jsbin.com/ulazic/2

于 2012-10-07T15:46:52.457 回答