Динамическое создание элементов. Не работает onclick
Здравствуйте! Пытаюсь сделать маленький тест, каждый новый вопрос появляется после ответа на предыдущий.
Создаю кнопку перехода к следующему вопросу.
var next = document.createElement("input");
next.setAttribute('type','button');
next.setAttribute('value','next');
next.setAttribute('onclick',question2);
//next.attachEvent('onclick',question2);
document.body.appendChild(next);
где question2 - функция, в которую хотелось бы передать ещё параметр - ответ на предыдущий вопрос. Но это потом. Для начала у меня не срабатывает она никак:
function question2()
{
document.write('it works!');
alert("wtf");
}
Если расскоментирую attachEvent, а через аттрибут закоментирую, то кнопка вообще не появляется. Подскажите в чём проблема, или хотя бы где посмотреть/почитать. |
http://javascript.ru/tutorial/events/intro
И можно писать просто next.type = "button", next.value = "next" |
Цитата:
|
Здесь конструкция с кавычками setAttribute аналогична
next.setAttribute('onclick','question2()');
|
Цитата:
next.onclick = question2;
function question2(){
alert('Ya');
}
еще статья на заметку http://javascript.ru/unsorted/top-10...ns#10-addevent |
Цитата:
Обычно изменяют через свойства. |
И всё-таки, что-то никак не получается сделать рабочим онклик!!!
прошу взглянуть весь код (там пока бардак, но даже с алертом не пашет):
function start()
{
document.write('Choose importance of decision<br />');
// Create a select element dynamically
var select = document.createElement("select");
for (var i=1; i<=10; i++)
{
var option = document.createElement("option");
option.text = i;
option.value = i;
try
{
select.add(option, null); //Standard
} catch(error)
{
select.add(option); // IE only
}
}
document.body.appendChild(select);
// End of creating select
var next = document.createElement("input");
next.setAttribute('type','button');
next.setAttribute('value','next');
//next.addEventListener = ("click", function() { alert('whats up, nigga?') }, false)
next.onclick = function() { alert('whats up, nigga?'); };
//next.onclick = function() { question2('whats up, nigga?') }
//next.setAttribute('onclick',question2);
//next.attachEvent('onclick',question2);
document.body.appendChild(next);
}
function question2(msg)
{
document.write('it works!');
alert(msg);
}
Почему не хочет кликаться? (там закомментированы все попытки) |
Как так? Код рабочий.
Загляни в консоль ошибок, должно проясниться. Обычно она открывается по Ctrl+Shift+I. |
Ничего не показывает. У вас код работает?
|
|
Автору темы будет нелишним.
|
Цитата:
А вот это: Цитата:
|
Я же сказал - посмотри в консоль ошибок.
|
Не пишет же, я писал раньше. Реально, не могу понять в чём прикол. Что в мозилле, что в хроме
|
Покажи свой index.html
|
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN”
“http://www.w3.org/TR/html4/strict.dtd”>
<html>
<head>
<META http-equiv="Content-Script-Type" content="text/javascript">
<title>Decision Helper, v1.0</title>
<LINK rel=“stylesheet” href=“styles.css" type=“text/css”>
<script type="text/javascript" src="scripts.js"></script>
</head>
<body>
<h3>Decision Helper</h3>
<form>
<input type="button" value="Start" onclick="start()">
</form>
</body>
</html>
|
Цитата:
|
Master_Sergius,
браузер ie? |
Цитата:
Прошу подсказать, как в порядок привести, я по хороших книгах делаю. А насчёт браузера - тоже писал выше - файрфокс и хром |
Прочти статью по ссылке, что дал Aetae.
Нельзя использовать document.write после того, как документ загружен. |
Цитата:
|
Master_Sergius,
попробуйте переписать свой код и неиспользовать это Цитата:
Цитата:
|
Переписал, это заработало! Теперь, пытаюсь создать область с радио кнопками, и они без подписей получаются...
var question = document.createElement("p");
question.setAttribute('class', 'question');
question.setAttribute('id', 'question');
question.innerHTML = 'Is it your intension or somebody\'s offer?';
document.body.appendChild(question);
var fieldset = document.createElement("fieldset");
var legend = document.createElement("legend");
legend.innerHTML = 'Choose one of:';
fieldset.appendChild(legend);
var option = document.createElement("input");
option.setAttribute('type', 'radio');
option.setAttribute('name', 'answer');
option.setAttribute('id', 'a1');
option.setAttribute('value', 'a1');
fieldset.appendChild(option);
option.innerHTML = 'my intension';
var br = document.createElement("br");
fieldset.appendChild(br);
var option = document.createElement("input");
option.setAttribute('type', 'radio');
option.setAttribute('name', 'answer');
option.setAttribute('id', 'a2');
option.setAttribute('value', 'a2');
option.innerHTML = 'somebody\'s offer';
fieldset.appendChild(option);
document.body.appendChild(fieldset);
Тобишь вот этих option.innerHTML не видно. Но когда беру инспект елемент, то код вроде всё ок, по образу и подобию написал чисто хтмл и всё ок. В чём может быть проблема? |
А ты где-нибудь видел, чтобы у инпутов был innerHTML?
И еще совет - если в коде несколько раз повторяется одно и то же, то код херня. Повторающиеся участки выноси в функции. Во-первых, такой код будет быстрее писать, во-вторых, легче читать, в-третьих, как следствие первого и второго, легче расширять, в-четвертых - будет меньше вероятность ошибиться. |
А как тогда создать скриптом инпуты радиобаттоны? В обычных кнопках - велью - подпись
|
Спасибо, через лабел работает. Но, если просто писать сам код хтмл вот так:
<fieldset> <legend>Choose one of:</legend> <input type="radio" name="answer" id="a1" value="a1">answer 1</input> <br /> <input type="radio" name="answer" id="a2" value="a2">answer 2</input> </fieldset> То есть подписи без лабелов |
Нет, это не подпись. Это просто текст после инпута. Браузер отбрасывает ненужный закрывающий тег, и получается так:
<fieldset> <legend>Choose one of:</legend> <input type="radio" name="answer" id="a1" value="a1">answer 1 <br /> <input type="radio" name="answer" id="a2" value="a2">answer 2 </fieldset> |
Большое всем спасибо! Всё теперь получается. Как тему закрыть? Или позначить, что "решено"?
|
Никак. Зачем это?
|
Ну, во-первых, кому-то решения на схожие вопросы нужны, а вот тут хоп и есть с пометкой решено. И все решенные в топ помещаются, чтоб видно было или ещё как-то. Во-вторых, чтоб больше не раздували тему до ненужных размеров.
|
Тут формат форума, а не q&a. Суть тут не решить чьи-то проблемы, а всесторонне оные обсудить.=)
|
| Часовой пояс GMT +3, время: 10:29. |