Я довольно неопытный с JavaScript, и после довольно многого поиска и просмотра других потоков мне сложно определить, как я могу динамически удалять поле из в форме, похожей на мой вариант использования (или, скорее всего, я просто не получаю!).Как найти родительский узел и удалить дочерний элемент
Я понимаю, что элемент не может быть удален из DOM без ссылки на родительский узел. Тем не менее, я не совсем уверен, что я должен ссылаться на родительский узел в моем коде при использовании removeChild(). Я подозреваю, что это что-то в моем HTML; было бы здорово, если бы кто-то мог указать мне в правильном направлении.
<div>
в HTML <body>
<div class="wrapper">
<div class="sidebar" text-align="center">
myFormFieldLabel <button onclick="myFunction()">add</button></p>
</div>
<div class="main" text-align="center">
<form name="myForm" action="/" method="POST">
some text goes here.
</br>
<hr>
</br>
<div class="fields" id="rf1">
<!--added form fields will appear here-->
</div></p>
</div>
<div class="submit">
<input type="submit" value="Submit" />
</form>
</div>
</div>
JavaScript, который создает поле динамически:
function myFunction(){
var r = document.createElement('span');
var y = document.createElement("INPUT")
var p = document.createElement('p');
var g = document.createElement("IMG");
y.setAttribute("type", "text");
y.setAttribute("placeholder", "myFormField");
g.setAttribute("src", "delete.png");
g.setAttribute("onclick", //should remove entire form input field(span)//);
increment();
y.setAttribute("Name", "myField" + "~input_" + i);
r.appendChild(y);
r.appendChild(g);
r.appendChild(p);
document.getElementById("rf1").appendChild(r);
}
Обычно ошибка я нарваться при настройке кода здесь и там Uncaught TypeError: Cannot read property 'removeChild' of null
Я действительно хочу предложить использовать JQuery для этого ... но тогда я только теперь понимаю, что я не могу даже код, используя родной язык. Теперь я ненавижу себя. – Gideon