Переопределяет собственное поведение при выборе текстов на мобильном устройстве

Я хотел бы знать, есть ли способ переопределить собственное поведение при выборе текстов в мобильном браузере. Я пытаюсь поддерживать как iPhone, так и устройства Android, предоставляя свою собственную панель действий.

Какие-нибудь советы?

Solutions Collecting From Web of "Переопределяет собственное поведение при выборе текстов на мобильном устройстве"

Хотя вы могли бы просто использовать событие changechange, чтобы показать свою «панель действий» вместе с собственной функциональностью, если вы захотите «заменить» нативное поведение, вам нужно либо подделать все выборы с нуля, либо использовать событие changechange, а второе Выбор сделан для того, чтобы вы, например, обернули выделенный текст с помощью цветного элемента span и отменили реальный выбор (показывая свою панель действий), проблема с этим методом заключалась бы в том, что 1) может отображаться нативная панель действий для секунды разделения и 2 ) Опыт будет отличаться от того, что пользователь использует для возможного наличия опасных эффектов. Если, с другой стороны, вы захотите сделать выбор с нуля, вы должны использовать свойство user-select css для user-select чтобы отключить выбор текста и следующий результат на основе сенсорного экрана, и вы хотите, чтобы текст был выбран (с цветными интервалами) (реалистично Возможно только в чрезвычайно контролируемой среде (например, приложение для чтения только с текстом)).

Обратите внимание, что это не будет работать в Firefox и Opera, так как событие selectionchange не запускается там, и вам нужно будет использовать touchend события touchend на документе + прекращение пузырьков всех других событий touchhend для поддержки мобильного телефона opera и firefox mobile. (Кредит за то, что select не работает, и selectionchange должен использоваться для Tim Down)

Справка:

JsFiddle Демо с плагином

В приведенном выше jsFiddle Demo, который я использовал, используется плагин, позволяющий предотвратить блокировку любого блока текста на устройствах Android или iOS (наряду с настольными браузерами).

Это не мешает другой разметке, например jQuery .click(); Слушателей событий, как показано в jsFiddle.

Он прост в использовании, и вот примерная разметка после установки плагина jQuery.

Пример HTML:

 <p class="notSelectable">This text is not selectable</p> <p> This text is selectable</p> 

Пример jQuery:

 $(document).ready(function(){ $('.notSelectable').disableSelection(); }); 

Полный плагин jQuery:

 $.fn.extend({ disableSelection: function() { this.each(function() { this.onselectstart = function() { return false; }; this.unselectable = "on"; $(this).css('-moz-user-select', 'none'); $(this).css('-webkit-user-select', 'none'); }); } }); 

Если ваша цель – предотвратить выбор, вы можете использовать некоторые CSS, например

 body { -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; user-select: none; }