Предотвращение выбора текста, работающего в IE, но не в Chrome?

Я видел несколько различных сообщений относительно предотвращения выделения текста, но по какой-то причине этот код предотвращает выделение в IE, но не в Chrome..I не могу понять, почему это ..Предотвращение выбора текста, работающего в IE, но не в Chrome?

<input type="text" class="form-control no-select" name="inputField" placeholder="Select" ng-model="ctrl.ngModelValue"> 

.no-select { 
    -webkit-touch-callout: none; /* iOS Safari */ 
    -webkit-user-select: none; /* Chrome/Safari/Opera */ 
    -khtml-user-select: none; /* Konqueror */ 
    -moz-user-select: none;  /* Firefox */ 
    -ms-user-select: none;  /* IE/Edge */ 
    user-select: none; 
}

Я в основном хочу предотвратить выделение текста (ng-model) во входном файле.

Этот код предотвращает выбор текста, когда я в IE, но по какой-то причине я все же могу выделить текст во входном элементе в Chrome? Обычно это происходит наоборот, когда дело доходит до чего-то работающего.

Может кто-нибудь сказать мне, почему это может быть и как это исправить?

Спасибо!

источник

2016-04-06 techer

Ну, я не знаю, как это исправить с помощью css в input поле, user-select: none правило будет применяться также в других тегов, таких как <p><div> т.д.

Вот JavaScript решение для вас

см FIDDLE

var inp = document.getElementById('myElement'); 
 
inp.addEventListener('select', function() { 
 
    this.selectionStart = this.selectionEnd; 
 
}, false);

.no-select { 
 
    -webkit-touch-callout: none; /* iOS Safari */ 
 
    -webkit-user-select: none; /* Chrome/Safari/Opera */ 
 
    -khtml-user-select: none; /* Konqueror */ 
 
    -moz-user-select: none;  /* Firefox */ 
 
    -ms-user-select: none;  /* IE/Edge */ 
 
    user-select: none; 
 
}

<input type="text" id="myElement" class="form-control no-select" name="inputField" placeholder="Select" ng-model="ctrl.ngModelValue"> 
 
    
 
<p class="no-select"> 
 
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque quas, illo iste! Obcaecati quisquam, error doloremque, numquam iste, laboriosam possimus nostrum optio aperiam, distinctio quo accusamus cum molestias! Est, at! 
 
</p>

источник

2016-04-06 05:15:35

Спасибо, это может сработать. Одна часть об этом мне не очень нравится в Chrome, она позволяет мне на самом деле выделить текст, но затем просто удаляет его, когда вы позволяете щелчку мыши идти в первый раз, а в IE это позволяет мне делать то же самое каждый время. Я думаю, что это путает пользователя. Есть ли способ сделать так, чтобы подсветка не происходила вообще, и мигающий курсор во входном элементе никогда не перемещается. Я получаю этот эффект с помощью css 'user-select' в IE, но по какой-то причине он не работает в chrome. Вариант JS хорош, если я могу получить тот же эффект. Спасибо – techer

@techer Я пока не нашел никакого решения css или почему это происходит в хроме. Дождитесь других ответов :) –

Вот рабочий раствор, который решил это для меня: Disable Text Selection in Chrome

window.onload = function() { 
     var element = document.getElementById('content'); 
     element.onselectstart = function() { return false; } // ie 
     element.onmousedown = function() { return false; } // mozilla 
}

выше задает конкретный элемент и отключил выделение текста. Работает в Chrome, IE и Firefox. Это работает без каких-либо css.

источник

2016-04-06 20:55:04 bschmitty

Предотвращение выбора текста, работающего в IE, но не в Chrome?

ответ

Смежные вопросы