Курсы javascript
она предназначена чисто для кнопки искать при нажатии на нее будет запускаться php
Остальное сделано на ajax но чего-то вообще меня клемануло ,не могу получить данные.
Т.е. человек в input форме текст вводит текст и по изменению в id (я думаю по событию Change )должна запускаться функция в которую передается значение input формы. Вот как передать
вот сам ввод
а как получить этот input значение и передать
и очень важно без всяких form
Как получить input в JavaScript (1 часть)
На этом уроке мы научимся получать значения, введенные пользователями в поле input и совершать с ними арифметические действия.
HTML разметка
Возьмем за основу бутстраповскую разметку (getbootstrap.com), из раздела Components / Forms. У нас должна получиться форма с двумя полями для ввода чисел и кнопка. Сделаем тип полей у инпутов текстовым, для возможности ввода, как чисел, так и строк.
Умножение чисел
Для того чтобы обратиться конкретно к элементу input на языке JavaScript, нам нужно к этому элементу добавить уникальный идентификатор. Зададим двум полям input два разных идентификатора: inp_1 / inp_2. На одной странице не может быть двух одинаковых id. Иными словами, функция JS, может обратиться к input, только через название id.
Что мы хотим получить в итоге?
После ввода произвольных чисел в созданные поля формы, при нажатии на кнопку, должно произойти простое арифметическое действие – умножение двух чисел и появиться результат.
Событие JavaScript
Для того, чтобы при нажатии на кнопку что-то срабатывало, добавим событие onclick, при клике будет выполняться функция multi() (произвольное название), круглые скобочки обязательны. Они указывают, что это функция.
Итак, у нас появилась форма, куда можно вводить числа, однако клик по кнопке ничего не дает. Пора заняться непосредственно программированием на JS.
Функция на JavaScript
Между тегами script напишем функцию function и название её multi(), затем внутри фигурных скобочек, пропишем выражение, результат которого, увидим на всплывающем окне alert.
JS получить значение input
Надо вывести результат умножения двух чисел в окне alert, но мы не знаем какие числа пользователь ввел, эти данные надо узнать. Для этого, внутри круглых скобочках alert, обращаемся к элементам input, через метод document.getElementById().
Расшифровывается метод так:
В текущем документе получить элемент по id. Этот метод получает весь элемент input, с классами, типом полей, а нам надо узнать только число, введенное пользователем в поле input — значение value.
Получить элемент с id inp_1 и из него вытащить только то, что ввел пользователь. Точно так же, вытаскиваем число и из второго поля.
Таким образом, JavaScript узнает числа, введенные пользователем, умножает их и выдает готовый результат в окне alert, после того, как пользователь кликнет по кнопке.
Команда alert помогает разработчику, отлаживать код, находить ошибки в процессе разработки.
Что такое переменная
document.getElementById(‘inp_1’).value*document.getElementById(‘inp_2’).value
Это выражение прекрасно делает свою работу, но при каждом обращении к нему, нам надо переписывать его в таком длинном виде. Это неудобно, код в документе разрастается и становится трудночитаемым. Было бы удобно всю эту длинную запись целиком поместить в маленькую ячейку, на хранение, чтобы вытаскивать оттуда данные, когда потребуется. Такие ячейки и называются в программировании переменными.
Переменные это ячейки, куда можно что-то положить, а затем оттуда вытащить, используя только имя переменной. Продолжение следует..
Создано 28.12.2018 10:16:00
Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!
Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.
Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления
Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.
Порекомендуйте эту статью друзьям:
Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):
- Кнопка:
Она выглядит вот так: - Текстовая ссылка:
Она выглядит вот так: Как создать свой сайт - BB-код ссылки для форумов (например, можете поставить её в подписи):
Комментарии ( 2 ):
dryg 23.06.2020 00:51:23
а как приплюсовать например на моем личном сайте хотелось бы сделать чтоб сумма считалось при заполнении http://manyk.ru/
dryg 23.06.2020 01:41:51
вместо умножения ставлю + не работает мне надо для моего сайта сделать чтоб определить сумму стоимость работ и вывести на сайт http://manyk.ru/
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.
Copyright © 2010-2023 Русаков Михаил Юрьевич. Все права защищены.
Как получить значение из input javascript
Чтобы получить значение из элемента input , достаточно обратиться к свойству value . Например, если на странице имеется такой элемент ввода:
id="input-id"> то из него можно получить значение следующим образом
const input = document.getElementById('input-id'); // Извлекаем элемент input const value = input.value; // получаем занчение из input Как получить данные из input?
Как с помощью JS принимать данные на ходу? Т.е. без нажатия button
Проверять на правильность заполнения даты в полях и сравнения этих двух дат?
var firstDate = document.getElementsByClassName("firstDate")[0].value; var secondDate = document.getElementsByClassName("secondDate")[0].value; function formatDate(date) < var dd = date.getDate(); if (dd < 10) dd = '0' + dd; var mm = date.getMonth() + 1; if (mm < 10) mm = '0' + mm; var yy = date.getFullYear() % 100; if (yy < 10) yy = '0' + yy; return dd + '.' + mm + '.' + yy; >var d = new Date(2014, 0, 30);
Вот есть такой код, но что делать с ним дальше, ума не приложу, на jquery сделал бы это, но вот надо на чистом JS Как совершить проверку этих данных с помощью функции formatDate