[contact-form-7 id="504" title="Контактная форма 1"]
Приветствую!
Сегодня хочу рассказать, как работать с элементом формы через атрибут [name=’имя_поля’] в JS.
Иногда случается, что у input’ов не прописаны классы или id, и нет возможности дописать их самому. Но зато есть, например, атрибут name. Допустим мы имеем простую форму:
<form enctype="multipart/form-data" method="post" action="mail.php"> <input type="text" name="your_name"> <input type="text" name="email"> <textarea type="text" name="message"> <input type="submit" value="Отправить"> </form>
Для начала не забудем подключить библиотеку JQuery (вставляем между тегами <head></head>):
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
Теперь нам нужно каким-то образом изменить поле <input type=’text’ name=’your_name’>. Прямое обращение к элементу по типу
$(«input[name=’your_name’]»).val(«Иван Иванов»);
не работает. Поэтому чтобы обратиться к данному полю просто добавляем знак доллара ($) перед знаком равно (=):
$(«input[name$=’your_name’]»).val(«Иван Иванов»);
Таким образом, мы можем через JS изменять элемент формы, обращаясь к нему только через атрибут [name=’ ‘].
Cтрока кода, приведённая в примере, устанавливает значение «Иван Иванов» полю input с атрибутом [name=’your_name’]. Это может пригодиться, если пользователь ничего не ввёл, но нам нужно, чтобы поле было заполнено. Например, в некоторых плагинах в бесплатных версиях не всегда можно отключить обязательность заполнения какого-то поля, но при этом нам не нужно, чтобы оно было обязательным для заполнения. Тогда обходим это препятствие, «насильно» заполняя поле через JS.
На этом всё, всем удачи и пока!