Как узнать, выбран ли текст в текстовом поле?
У меня есть текстовые поля <input type='text'>
, которые позволяют только числовые символы и не позволяют пользователю вводить точку (.) более одного раза. Проблема в том, что если текст в текстовом поле выбран, пользователь намеревается перезаписать содержимое точкой, что делает его допустимым! Вопрос в том, как вы можете указать в javascript, выбран ли текст в этом текстовом поле или нет.
Спасибо
Ответы
Ответ 1
Ниже вы узнаете, выбран ли весь текст в текстовом входе во всех основных браузерах.
Пример: http://www.jsfiddle.net/9Q23E/
код:
function isTextSelected(input) {
if (typeof input.selectionStart == "number") {
return input.selectionStart == 0 && input.selectionEnd == input.value.length;
} else if (typeof document.selection != "undefined") {
input.focus();
return document.selection.createRange().text == input.value;
}
}
Ответ 2
Вместо того, чтобы нажимать на стену цифр и выходов, вы можете легко подняться, проверив значение в событии onchange
.
HTML:
<input type="text" onchange="ValidateNumericValue(this);" />
JS:
function ValidateNumericValue(oInput) {
var blnRequired = true; //set to false if allowing empty value
var sValue = oInput.value;
if (blnRequired && sValue.length == 0) {
alert("Please enter a value");
oInput.focus();
return;
}
var numericValue = parseFloat(sValue);
if (isNaN(numericValue)) {
alert("Value is not a valid number");
oInput.focus();
return;
}
//put back to make 2.15A back to 2.15
oInput.value = numericValue + "";
}
Это будет проверять значение при изменении (и пользователь переходит к другому элементу), а когда он недействителен, он будет предупреждать и устанавливать фокус назад.
Живой тестовый пример: http://jsfiddle.net/yahavbr/NFhay/
Ответ 3
Для тех, кому нужен код для получения выделенного текста в текстовом поле, здесь расширенная версия:
http://jsfiddle.net/9Q23E/527/
function getSelection(textbox)
{
var selectedText = null;
var activeElement = document.activeElement;
// all browsers (including IE9 and up), except IE before version 9
if(window.getSelection && activeElement &&
(activeElement.tagName.toLowerCase() == "textarea" || (activeElement.tagName.toLowerCase() == "input" && activeElement.type.toLowerCase() == "text")) &&
activeElement === textbox)
{
var startIndex = textbox.selectionStart;
var endIndex = textbox.selectionEnd;
if(endIndex - startIndex > 0)
{
var text = textbox.value;
selectedText = text.substring(textbox.selectionStart, textbox.selectionEnd);
}
}
else if (document.selection && document.selection.type == "Text" && document.selection.createRange) // All Internet Explorer
{
var range = document.selection.createRange();
selectedText = range.text;
}
return selectedText;
}
Ответ 4
Вы можете получить идентификатор выбранного элемента на странице со следующим кодом:
elem_offset = document.getSelection().anchorOffset;
elem = document.getSelection().anchorNode.childNodes[elem_offset];
alert(elem.id);
Ответ 5
Специфический ответ 2017. В то же время столкнулся с той же проблемой.
Мы разрешали пользователям вводить только 3 цифры за раз. Когда пользователь попытался ввести четвертый символ, мы вернули false.
Это стало проблемой, когда пользователь имел выбор и пытался перезаписать значения.
Взять подсказку из ответа Тима. Я понял, что хочу, чтобы selection value
был таким же, как input value
.
В современных браузерах я достиг этого:
document.getSelection.toString() === input.value
Надеюсь, это поможет кому-то.