Question

我需要能够防止被选中的图像（放置在DIV中）。我尝试了很多建议，但似乎没有一个在IE8上工作。事实是，当用户用鼠标选择文本时，在IE8（并且只有IE8）中，图像也被选中。将示例上传到网络（而非此处）似乎是最简单的，因此您可以在中找到示例 http://www.enosis-dev.com/select.html 单击查看源以查看代码。任何帮助将不胜感激。尼尔。

Answer 1

将<div>与背景图片而不是<img>一起使用。如果有问题的图像是100像素×50像素（例如），那么这样的事情应该可以解决问题：

<div style="display: inline-block; width: 100px; height: 50px: background: url(/path/to/image.jpg);"></div>

如果您需要支持IE7，那么您可能需要使用特定于IE7的样式表（最好使用条件注释加载）将display: inline-block更改为display: block。

上述问题是，在用带有背景的<img>标签替换<div>标签之前，您需要了解图像尺寸。您可以使用jQuery在客户端进行替换以解决该问题，但需要注意确保在替换之前加载图像：

$(window).load(function() {
    $('img').each(function() {
        var $img         = $(this);
        var $replacement = $('<div/>');
        $replacement.css({
            width:      $img.width()  + 'px',
            height:     $img.height() + 'px',
            display:    'inline-block',
            background: 'url(' + $img.attr('src') + ')'
        });
        $img.after($replacement).remove();
    });
});

$(window).load()在所有内容都加载后才会触发，因此所有图像大小都应该知道。

如果IE7是一个问题，那么你可以将display: inline-block位放在一个类中，并以通常的方式使用IE7特定的样式表覆盖它。

Answer 2

尝试
ele.onselectstart = function（）{return false; }

ele.unselectable =“on”;

或尝试
user-select：none; -webkit-user-select：none; -o-user-select：none; -moz-user-select：none;

在Firefox / Chrome / Safari中无法选择的作品，不适用于IE8

2 个答案: