2012-06-05 2 views
1

У меня есть следующий код:Как я могу динамически добавлять и изменять divs в javascript?

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript"> 

function timeMsg() 
{ 
var t=setTimeout("enterquestion()",900000); 
} 


function enterquestion() 
{ 
document.getElementById("questions").innerHTML += '<p>' + document.getElementById("question").value; 


} 
</script> 
</head> 
<body> 

<h1>Testing Website</h1> 
<p id="questions"></p> 

<input type="text" name="question" id="question" /> 
<button type="button" onclick="timeMsg()">Enter question</button> 


</body> 
</html> 

Весь этот код делает это позволяет пользователю вводить вопрос, а затем он добавляет вопрос к списку вопросов после того, как 15 минут прошли.

Все, что я хотел бы сделать с кодом, это сделать так, чтобы он сразу же помещал текст «ВОПРОС ЗАПИСИ» в то место, где будет отображаться вопрос, а затем просто добавляя вопрос до конца, должен заменить текст «ВОПРОС ЗАПИСАН» на вопрос.

Я не могу понять, как это сделать, чтобы одновременно вводить несколько вопросов.

Любая помощь с учётом,

Thanks!

+0

Ум, позвоните по функции нажатием кнопки? – epascarello

ответ

0

Свойство innerHTML удобно, если вы хотите заменить все содержимое элемента, но не добавлять или вставлять дочерние узлы. Для этого проще использовать createElement.

Ниже приведен пример, чтобы вы собираетесь:

<script> 
function addDiv(parent, text) { 
    var div = document.createElement('div'); 
    div.appendChild(document.createTextNode(text)); 
    parent.appendChild(div); 
} 
</script> 

<form action="serverprocess" onsubmit="return false;"> 
    <input type="text" name="qText" value="Question text"> 
    <button onclick=" 
    addDiv(document.getElementById('container'), this.form.qText.value); 
    ">Add question</button> 
</form> 
<div id="container"></div> 

В приведенном выше, если Javascript не доступен или активный, форма будет представлена ​​и обработка может быть сделана на сервере. Если он доступен, он будет обработан локально, и форма не будет отправлена, хотя представление действительно должно основываться на успешном завершении действий.

Я оставлю это для вас, чтобы обдумать.

+0

Большое спасибо, это было очень полезно! – user1436113

Смежные вопросы