Как я могу сделать некоторые части моего html недоступными?

У меня есть некоторые абсолютно позиционированные div, которые продолжают выбираться, если пользователь пытается выбрать содержимое моей страницы.

Есть ли способ сделать так, чтобы определенные элементы (такие как те div) не были выбраны?

РЕДАКТИРОВАТЬ: Основная проблема заключается в том, что кто-то копирует этот абсолютный div, а затем вставляет их в текстовый редактор на моем сайте, редактор текстового редактора разбивается на IE.

Ответ 1

Если вы хотите просто скрыть прямоугольник выделения, вы можете использовать

element::selection { background: transparent }

и его аналог для Gecko

element::-moz-selection { background: transparent }

Если вы хотите, чтобы ваши пользователи выбирали правильный текст для копирования в буфер обмена, вы можете перемещать элемент. Обычно браузеры сохраняют порядок элементов, как они определены в HTML при выборе. Хотя это не идеальное решение, вы можете поместить код элемента в HTML либо в самом начале, либо в конце тега <body>. Таким образом, если пользователь выбирает что-то в середине страницы, элемент будет слишком "далеко", чтобы вмешиваться.

Ответ 2

Для IE добавьте атрибут unselectable="ON". ( EDIT: хотя это не поможет полностью)

Для Gecko добавьте стиль CSS -moz-user-select: none.

Для WebKit добавьте стиль CSS -webkit-user-select: none.

Ответ 3

эта статья может помочь с кросс-браузерным решением: (использует jQuery) http://aleembawany.com/2009/01/20/disable-selction-on-menu-items-with-this-jquery-extension/

в теории, вы можете расширить ядро jQUery, используя это:

jQuery.fn.extend({ 
    disableSelection : function() { 
            return this.each(function() { 
                    this.onselectstart = function() { return false; }; 
                    this.unselectable = "on"; 
                    jQuery(this).addClass('unselectable');
            }); 
    } 
});

и применяя его следующим образом:

// disable selection on selected objects 
$('.myClass').disableSelection();

вы должны убедиться, что у вас есть это в таблице стилей:

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

выглядит так, как будто это в основном делает то, что упомянули SLaks и Sime. я не пробовал, но мне было бы интересно узнать, работает ли он

Ответ 4

Вы можете использовать псевдоэлемент ::selection, чтобы сделать выделение определенного элемента "невидимым":

p::selection { background-color:transparent; }  
p::-moz-selection { background-color:transparent; }

Однако это не работает в IE.

Ответ 5

jQuery Решение:

$(".unselectable").disableSelection();