Передать значение элемента в input

Василич#
На сайте с 10.03.2009
Offline
111
536

Здравствуйте! Возникла необходимость автоматом подставлять значение из тэга h1 в поле input.

Нашёл на просторах интернета, но что-то не работает:


<script>
$(document).ready(function(){
if($("h1").text()!=""){ // если h1 не пустое
$("#prodtext").attr("value", $("h1").text()); //записываем значение в value
}
});
</script>

Есть поле:

<h1>Тыквенные семечки</h1>

и input:

<input name="prod" type="text" placeholder="Наименование продукции" id="prodtext" value="" required>

Подскажите, куда копать ?

bmw-power.com.ua (https://bmw-power.com.ua)
LEOnidUKG
На сайте с 25.11.2006
Offline
1723
#1

Всё отлично работает.

У вас случаем не два h1?

И у вас jquery то подключен к сайту?

✅ Мой Телеграм канал по SEO, оптимизации сайтов и серверов: https://t.me/leonidukgLIVE ✅ Качественное и рабочее размещение SEO статей СНГ и Бурж: https://getmanylinks.ru/
Василич#
На сайте с 10.03.2009
Offline
111
#2
LEOnidUKG:
Всё отлично работает.

У вас случаем не два h1?
И у вас jquery то подключен к сайту?

Спасибо большое, разобрался ! Оказывается блок с формой подтягивается через ajax, соответственно формируется после загрузки страницы. Пришлось впилить прямо туда.

VoV@
На сайте с 22.09.2007
Offline
196
#3
$("#prodtext").attr("value", $("h1").text());

Интересно, почему сделано через attr, а не так?

$("#prodtext").val($("h1").text());

Привычка, скрытый смысл, что-то ещё?

⭐ Разработка Андроид-приложений (Xamarin C#). ⭐ Разработка ASP.NET (WebForms, MVC, WebAPI, Core). ⭐ Цой жив!
Василич#
На сайте с 10.03.2009
Offline
111
#4
VoV@:
Интересно, почему сделано через attr, а не так?
$("#prodtext").val($("h1").text());

скорее, через недостаток знаний :)

S
На сайте с 11.05.2018
Offline
7
#5

VoV@, вообще между val и attr есть большая разница, одно возвращает свойства DOM, а второе - атрибуты HTML и в данном случае это играет очень большую роль, ТСу стоит использовать val чтоб не хардкодить загружаемый через ajax h1, attr не будет работать с загруженным через ajax контентом

S
На сайте с 30.09.2016
Offline
469
#6
swank:
VoV@, вообще между val и attr есть большая разница, одно возвращает свойства DOM, а второе - атрибуты HTML и в данном случае это играет очень большую роль, ТСу стоит использовать val чтоб не хардкодить загружаемый через ajax h1, attr не будет работать с загруженным через ajax контентом

Согласен. что большая разница (хотя в интернетах на этом не акцентируется внимание). Но вот что конкретно должен использовать ТС - это зависит от кокретной ситуации. Лично я предпочитаю тестировать готовый продукт - был случай, когда пришлось переписывать готовый код с val() на attr().

Забавно поиграть со следующим кодом - как вбивая данные вручную, так и просто обновляя страницу в разных браузерах

<h1>Тыквенные семечки</h1>
<input name="prod" type="text" placeholder="Наименование" id="prodtext" value="">
<button onclick='alert("Значение attr:"+$("#prodtext").attr("value")+"\n"+"Значение val:"+$("#prodtext").val());'>Запись attr</button><br/>
<input name="prod1" type="text" placeholder="Наименование 1" id="prodtext1" value="">
<button onclick='alert("Значение attr:"+$("#prodtext1").attr("value")+"\n"+"Значение val:"+$("#prodtext1").val());'>Запись val</button>

<script>
$(document).ready(function(){
if($("h1").text()!=""){ // если h1 не пустое
$("#prodtext").attr('value',$("h1").text()); //записываем значение в attr
$("#prodtext1").val($("h1").text()); //записываем значение в value
}
});
</script>
Отпилю лишнее, прикручу нужное, выправлю кривое. Вытравлю вредителей.

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий