Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 21.11.2014, 18:15
Интересующийся
Отправить личное сообщение для klk.pma Посмотреть профиль Найти все сообщения от klk.pma
 
Регистрация: 30.06.2014
Сообщений: 23

Для нескольких input одна функция
Добрый день! Я начинающий, поэтому если можно "пинайте" с примерами.
Возникла такая проблема:
есть несколько input
<input class="digit" type="text" maxlength="8" name="ot" value="">
<input class="digit" type="text" maxlength="8" name="do" value="">

В них должны вноситься только цифры, а все остальное не должно даже отображаться в них.

Если есть один input, то это можно реализовать через это:
document.getElementById("digit").onkeypress = function (e) {
	return !(/[^0-9]/.test(String.fromCharCode(e.charCode)));
}

<input id="digit" type="text" maxlength="8" name="ot" value="">


А как реализовать с помощью классов, так чтобы одна функция подходила для всех элементов с определенным классом?
Ответить с цитированием
  #2 (permalink)  
Старый 21.11.2014, 18:24
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от klk.pma
В них должны вноситься только цифры
Этот инпут больше подойдет:
<input type="number" max="99999999">

Но вводить позволяет не только числа. Но форма все равно не отправится если значение неверное.
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #3 (permalink)  
Старый 21.11.2014, 18:33
Интересующийся
Отправить личное сообщение для klk.pma Посмотреть профиль Найти все сообщения от klk.pma
 
Регистрация: 30.06.2014
Сообщений: 23

Сообщение от danik.js Посмотреть сообщение
Этот инпут больше подойдет:
<input type="number" max="99999999">

Но вводить позволяет не только числа. Но форма все равно не отправится если значение неверное.
Я знаю про number, но этот вариант не подходит. Самый подходящий вариант это JS
Ответить с цитированием
  #4 (permalink)  
Старый 21.11.2014, 18:45
Интересующийся
Отправить личное сообщение для klk.pma Посмотреть профиль Найти все сообщения от klk.pma
 
Регистрация: 30.06.2014
Сообщений: 23

Хотя бы подскажите, как правильно обращаться к классам, чтобы менять их значение. Пробовал через getElementsClassName("digit"), но все тшетно
Ответить с цитированием
  #5 (permalink)  
Старый 21.11.2014, 18:52
Профессор
Посмотреть профиль Найти все сообщения от krutoy
 
Регистрация: 09.11.2014
Сообщений: 610

<!DOCTYPE HTML>
<html>
  <head><meta charset="windows-1251" /> </head>
  <body>

<input class="digit" type="text" maxlength="8" name="ot" value="">
<input class="digit" type="text" maxlength="8" name="do" value="">

    <script>
digits=document.getElementsByClassName("digit")
filter=function () {
   if(/\D+/g.test(this.value)) this.value=this.value.replace(/\D+/g, "")
}
for(i in digits){if(/\d+/.test(i)) digits[i].oninput=filter}




    </script>
  </body>
</html>
Ответить с цитированием
  #6 (permalink)  
Старый 21.11.2014, 19:01
Интересующийся
Отправить личное сообщение для klk.pma Посмотреть профиль Найти все сообщения от klk.pma
 
Регистрация: 30.06.2014
Сообщений: 23

Спасибо, то что надо!
Кстати, первый раз увидел такой перебор цикла for(i in digits). Такое только в JS возможно?
Ответить с цитированием
  #7 (permalink)  
Старый 21.11.2014, 19:04
Профессор
Посмотреть профиль Найти все сообщения от krutoy
 
Регистрация: 09.11.2014
Сообщений: 610

Сообщение от klk.pma
Такое только в JS возможно?
Я в питоне кажется видел такое. Еще где-то. Да не, во многих яп есть подобное, я думаю.
Ответить с цитированием
  #8 (permalink)  
Старый 21.11.2014, 19:07
Интересующийся
Отправить личное сообщение для klk.pma Посмотреть профиль Найти все сообщения от klk.pma
 
Регистрация: 30.06.2014
Сообщений: 23

Сообщение от krutoy Посмотреть сообщение
<!DOCTYPE HTML>
<html>
  <head><meta charset="windows-1251" /> </head>
  <body>

<input class="digit" type="text" maxlength="8" name="ot" value="">
<input class="digit" type="text" maxlength="8" name="do" value="">

    <script>
digits=document.getElementsByClassName("digit")
filter=function () {
   if(/\D+/g.test(this.value)) this.value=this.value.replace(/\D+/g, "")
}
for(i in digits){if(/\d+/.test(i)) digits[i].oninput=filter}
    </script>
  </body>
</html>
Пожалуйста, подскажите, а есть вариант реализовать подобную задачу через событие клавиатуры? Интересуюсь на будущее, для других похожих задач
Ответить с цитированием
  #9 (permalink)  
Старый 21.11.2014, 19:10
Профессор
Посмотреть профиль Найти все сообщения от krutoy
 
Регистрация: 09.11.2014
Сообщений: 610

Сообщение от klk.pma
Пожалуйста, подскажите, а есть вариант реализовать подобную задачу через событие клавиатуры? Интересуюсь на будущее, для других похожих задач
Можно, а почему нет. Какая разница.
<!DOCTYPE HTML>
<html>
  <head><meta charset="windows-1251" /> </head>
  <body>

<input class="digit" type="text" maxlength="8" name="ot" value="">
<input class="digit" type="text" maxlength="8" name="do" value="">

    <script>
digits=document.getElementsByClassName("digit")
filter=function (e) {
   console.log(e.keyCode)
   if(/\D+/g.test(this.value)) this.value=this.value.replace(/\D+/gi, "")
}
for(i in digits){if(/\d+/.test(i)) digits[i].onkeyup=filter}




    </script>
  </body>
</html>

Только притормаживает немного у меня в FF

Последний раз редактировалось krutoy, 21.11.2014 в 19:20.
Ответить с цитированием
  #10 (permalink)  
Старый 21.11.2014, 19:19
Интересующийся
Отправить личное сообщение для klk.pma Посмотреть профиль Найти все сообщения от klk.pma
 
Регистрация: 30.06.2014
Сообщений: 23

krutoy, а этот скрипт должен быть только после всех инпутов или его можно размещать в подключаемый файл в head?

Последний раз редактировалось klk.pma, 21.11.2014 в 19:24.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Пользовательская функция для графиков aleksey.danchin Общие вопросы Javascript 1 15.06.2014 12:22
AJAX функция для новых html-элементов broadcast77 AJAX и COMET 25 03.03.2014 12:01
поиск классов внутри тега yozuul jQuery 24 14.06.2013 21:00
как прописать условия для полей input и textarea Nailya Общие вопросы Javascript 12 06.06.2013 15:48
Функция onclick для созданных потомков Groonel Общие вопросы Javascript 6 24.04.2009 17:35