2015-12-09 4 views
0

Я новичок в javascript и просто пытаюсь изучить основы его динамического использования, а не через html-файл.Не могу увидеть форму, которую я создал dynamiclly javascript

Я пытаюсь создать форму динамически js поэтому у меня есть это в моем HTML файле:

<html> 
    <head> 
     <title>new Form</title> 
     <LINK rel="stylesheet" type="text/css" href='Formstyle.css'></LINK> 
    </head> 
    <body> 
     <script src='form.js'></script> 
    </body> 
</html> 

в моем файле JS У меня есть этот

var f = document.createElement("form"); 
f.setAttribute('method',"post"); 
f.setAttribute('action',"submit.php"); 

var i = document.createElement("input"); 
i.type = "text"; 
i.name = "user_name"; 

, но по какой-то причине я «Я запускаю файл в хроме, но ничего не получаю.

ответ

3

Вы создали форму, но вы никогда не добавляли ее в DOM (в этом случае вы никогда не добавляли вход в форму).

Использовать appendChild (или insertBefore и т. Д.).

+0

Спасибо. Я понял! – Mumfordwiz

0

вам нужно добавить свои элементы в документ

с чем-то вроде document.body.insertBefore

0

Во-первых, вы должны выяснить, где на странице вы хотите, чтобы форма идти. Предположим, вы хотите добавить свое поле ввода или форму в элемент «form».

Для этого вы должны сделать то же, что и другие, и добавить свой динамически созданный html к вашему DOM.

Я сделал codepen для вас, который добавляет поле ввода на кнопку мыши: http://codepen.io/alexG53090/pen/VeLpjd

HTML: 
<div id='container'></div> 
<button id='button'>click it</button> 

JS: 
var form = document.createElement('input'); 
var parent = document.getElementById('container'); 
container.appendChild(form); 
+0

Будьте осторожны @alex, в этом вопросе нет тега jquery. –

+0

О, мой, извините! Вот такой же кодекс, но без jquery !!!! http://codepen.io/alexG53090/pen/VeLpjd –

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