igortik
Новичок
Метод createElement
Столкнулся с проблемой в меру незнания JS
Задача такова:
1. Есть форма <form></form>
2. Необходимо реализовать добавление в тело формы элементов <input type="file">.
3. Добавление в структуру документа должно происходить без перезагрузки страницы - динамически.
4. Кол-во элементов не ограничено!
Я делаю:
var my_div = null;
var newDiv = null;
function addElement()
{
//создаем новый элемент div и добавляем в него немного контента
newDiv = document.createElement("div");
// это ясно - мой элемент для формы
newDiv.innerHTML = "<input type=\"file\" name=\"foto\" id=\"foto\">";
// добавляем только что соданый элемент в дерево DOM
my_div = document.getElementById("content");
document.body.insertBefore(newDiv, my_div);
}
<a href="#" onClick="addElement();" style="cursor
ointer">добавить еще фото</a>
<div id="content"></div>
И что выходит у нас...
Выходит то, что элемент формы-то вставляется, НО за пределы самой формы!
Что я только не пробовал - уже даже ставил id для form, но УВЫ ...
-~{}~ 21.10.08 00:42:
Я понимаю, что делает body.insertBefore(newDiv, my_div):
body - элемент, в котором вставляем дочерный элемент
newDiv - нод, который вставляем
my_div - нод, перед котором вставляем
Все было бы просто, если я бы создал div внутри самой формы и мой эелемент был бы вставлен перед дивом, НО в форме.
Не выходит, т.к. div внутри формы не виден для скрипта! И по нажатию на кнопку ничего не происходит. Даже Firebug молчит
Столкнулся с проблемой в меру незнания JS
Задача такова:
1. Есть форма <form></form>
2. Необходимо реализовать добавление в тело формы элементов <input type="file">.
3. Добавление в структуру документа должно происходить без перезагрузки страницы - динамически.
4. Кол-во элементов не ограничено!
Я делаю:
var my_div = null;
var newDiv = null;
function addElement()
{
//создаем новый элемент div и добавляем в него немного контента
newDiv = document.createElement("div");
// это ясно - мой элемент для формы
newDiv.innerHTML = "<input type=\"file\" name=\"foto\" id=\"foto\">";
// добавляем только что соданый элемент в дерево DOM
my_div = document.getElementById("content");
document.body.insertBefore(newDiv, my_div);
}
<a href="#" onClick="addElement();" style="cursor
ointer">добавить еще фото</a><div id="content"></div>
И что выходит у нас...
Выходит то, что элемент формы-то вставляется, НО за пределы самой формы!
Что я только не пробовал - уже даже ставил id для form, но УВЫ ...
-~{}~ 21.10.08 00:42:
Я понимаю, что делает body.insertBefore(newDiv, my_div):
body - элемент, в котором вставляем дочерный элемент
newDiv - нод, который вставляем
my_div - нод, перед котором вставляем
Все было бы просто, если я бы создал div внутри самой формы и мой эелемент был бы вставлен перед дивом, НО в форме.
Не выходит, т.к. div внутри формы не виден для скрипта! И по нажатию на кнопку ничего не происходит. Даже Firebug молчит
