2017-02-10 5 views
1

мне нужен входной текст-бокс, который может принимать только строки 0 и 1 как 00101110101.HTML Input Box с определенными номерами только

<input type="number"></input> ограничивает любые буквы, которые будут введены, однако, можно ввести 1,2, 3,4 и так далее. Мне нужно ограничить входную строку, состоящую только из 0 и 1.

Любой способ сделать это в HTML или с помощью Javascript?

+0

'pattern = [01]' Если пост-валидация приемлема. См. Пример здесь: http://www.w3schools.com/tags/att_input_pattern.asp –

+0

Просто добавьте прослушиватель событий «change» и разделите любые не двоичные символы. т.е. 'var input = document.getElementById ('двоичный-вход'); input.addEventListener ('change', function() {input.value = input.value.replace (/ [^ 0-1]/g, '')}); 'given' ' – Tobsta

+0

Обратите внимание, что если поле должно быть отправлено на сервер вам понадобится проверка на стороне сервера тоже. – nnnnnn

ответ

3

Вы можете использовать регулярное выражение (/[^01]/g) и replace удалить что-либо, кроме 0 и 1 от стоимости входного в.

document.getElementById("inp").oninput = function() { 
 
    var v = this.value;   // get the value from the input 
 
    v = v.replace(/[^01]/g, ''); // replace anything that isn't 0 or 1 by '' 
 
    this.value = v;    // set the value of the input to the new value 
 
}
<input id="inp"/>

Если вы хотите, чтобы пользователь по-прежнему редактировать вещи в середине, затем использовать это:

document.getElementById("inp").oninput = function() { 
 
    var pos = this.selectionStart; // save the position of the caret 
 
    
 
    var v = this.value; 
 
    v = v.replace(/[^01]/g, ''); 
 
    this.value = v; 
 
    
 
    this.selectionStart = pos; // restore it 
 
    this.selectionEnd = pos; // so no text will be selected 
 
}
<input id="inp"/>

Note ТНА t Я не рекомендую использовать этот последний подход, так как я не уверен, сколько браузеров обрабатывает selectionStart и selectionEnd.

+0

Было бы приятнее для пользователя, если бы вы добавили тест, чтобы не обновлять значение, если введены недопустимые символы, поскольку на данный момент, если вы попытаетесь отредактировать существующее значение, набрав середину, курсор продолжит движение до конца. – nnnnnn

+0

@nnnnnn, но затем они могут вставить незаконную ценность (это будет большая проблема, чем эта). –

+0

Пожалуйста, не надо. Кодекс, подобный этому, приводит меня в бешенство, поскольку я никогда не вижу, что не так, гораздо лучше, чтобы сделать недействительным вход. – Gerrit0

0

Это может вам помочь.

<input type="text" onkeypress='return event.charCode >= 48 && event.charCode <= 49'> 

Надеюсь, это поможет. С уважением.

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