Вставка текста в textarea в popup форме
Здравствуйте уважаемые господа. Нужна ваша помощь. Есть на сайте всплывающая popup форма. Хочу сделать так, чтобы по клику на кнопку <a href..... всплывала форма с вставленным произвольным текстом текстом в textarea.
Если вставить в консоль
document.getElementById("d[2]").value = "Johnny Bravo";
то всё работает. Подскажите пожалуйста куда копать ?Вот поле куда нужно вставить <textarea name="d[2]" id="d[2]" required=""></textarea> Кнопка <a class="form-button" href="#" onclick="myFunction()">КНОПКА</a>
<script>
function myFunction() {
document.getElementById("d[2]").value = "Johnny Bravo";
}
</script>
|
Цитата:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<!--
<script src='http://code.jquery.com/jquery-latest.js'></script>
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
function myFunction() {
document.getElementById("d[2]").value = "Johnny Bravo";
};
</script>
</head>
<body>
<a class="form-button" href="#" onclick="myFunction()">КНОПКА</a>
<textarea name="d[2]" id="d[2]" required=""></textarea>
</body>
</html>
|
Цитата:
Я так понимаю скрипт MyFunction загружается раньше чем всплывающее окно ? Если просто в консоль вставить
document.getElementById("d[2]").value = "Johnny Bravo";
то работает.Если так
function myFunction() {
document.getElementById("d[2]").value = "Johnny Bravo";
};
то пишет undefined. |
Цитата:
|
Цитата:
|
Это из-за квадратных скобок. Можно так:
document.querySelector('form').elements['d[2]'].value |
Цитата:
<script type='text/javascript'>
function myFunction() {
document.querySelector('form').elements['d[2]'].value = "Johnny Bravo";
};
</script>
<a href="#" class="form-button" onclick="myFunction()">КНОПКА</a> Не получается, пишет ошибку test10:360 Uncaught TypeError: Cannot read property 'elements' of null. |
<html>
<body>
<form>
<input name="d[2]" />
</form>
<script>
document.querySelector('form').elements['d[2]'].value = 't'
</script>
</body>
</html>
Ошибки есть? |
Цитата:
|
Мне ваши 404 по ссылке не нужны.
Жмем здесь на примере кода "Просмотреть", и ... ошибки есть? Вот и на сайте своем делайте подобным образом, только не "один к одному" с примером, а используя реальный селектор доступа к своей форме. |
Извиняюсь за непонимание, только недавно начал постигать.:help:
Вот этот код вызывает форму, подскажите пожалуйста как корректно вставить.
<script type="text/javascript">
$(function() {
//Form
var $form_link = $('.form-button'),
$form = $('#form_product');
$form_link.click(function(event) {
event.preventDefault();
if ($form.hasClass('opened')){
$form.removeClass('opened');
if (/iPod|iPad|iPhone/i.test(navigator.userAgent)) {
$('html').removeClass('overflowHidden');
} else {
$(document.documentElement).removeClass('overflowHidden');
}
} else {
$form.addClass('opened');
if (/iPod|iPad|iPhone/i.test(navigator.userAgent)) {
$('html').addClass('overflowHidden');
$('body').addClass('overflowHidden');
} else {
$(document.documentElement).addClass('overflowHidden');
}
}
$('.popup-form').s3IncludeForm('/forma' + '?form', function(){
if($('input[type="text"]').val() == '') {
$('input[type="text"]').parent().find('.placeholder').show();
}
});
return false;
});
$(".close-reveal-modal").on('click touchstart', function(event) {
$form.removeClass('opened');
});
});
</script>
|
KEMPZOR,
В вашем примере по ссылке скрипт выполняется при загрузке кода страницы до загрузки формы - отсюда и ошибка. Прочтите (внимательно!) свой пост№1 и пост№2 от ksa и подумайте - почему у него работает, а у вас - нет. |
Вы задаете один вопрос с описанием проблемы, а код показываете размером с портянку.
Еще раз о том, о чем была суть вопроса - невозможно обратиться к объекту, если в значении селектора по которому производится поиск присутствуют квадратные скобки. Как это можно вылечить используя DOM и было показано. У вас код выше использует jQuey, а значит в нем достучаться до поля с именем d[2] можно так - $('[name="d\\[2\\]"]').val('значение') Что еще пояснять? |
Цитата:
<form>
<input name="d[2]" />
</form>
<script type='text/javascript'>
$('[name="d\\[2\\]"]').val('значение')
</script>
Вот такая конструкция работает. Но вот если по кнопке, то значение как бы видно на долю секунды и потом оно исчезает. |
KEMPZOR,
Цитата:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function () {
$('.form-button').on('click', function () {
$("#d\\[2\\]").val("Johnny Bravo");
});
})
</script>
</head>
<body>
<a class="form-button" href="#">КНОПКА</a>
<textarea name="d[2]" id="d[2]" required=""></textarea>
</body>
</html>
|
Цитата:
|
KEMPZOR,
Цитата:
М.б. перед return false (строка 36 в пост#11) |
Цитата:
Отлично, заработало, низкий вам поклон! |
Цитата:
|
Цитата:
|
Какая разница на чем сайт расположен, я спрашиваю - зачем плодить еще и ID с "проблемным" же именованием? Ну коли есть проблемы с name="d[2]", хотя под JQ, это не проблема, и используется ID, тогда и именуйте его иначе, без использования квадратных скобок. Что нельзя просто id="d2" в таком случае? Какой смысл наступать на грабли второй раз?
|
| Часовой пояс GMT +3, время: 17:51. |