22.08.2014, 23:13
|
Аспирант
|
|
Регистрация: 29.07.2014
Сообщений: 42
|
|
Удаление группы элементов
Суть: нажимаю кнопочку - появляются поля для ввода данных и кнопка - отменить. Нажимаю кнопку "отменить" - это всё должно скрыться. Но, увы, удаляется не все, два текстовых поля остаются, если ещё поклацать туда-сюда - каша выходит. Вот скрипт:
Element.prototype.remove = function() {
this.parentElement.removeChild(this);
};
NodeList.prototype.remove = HTMLCollection.prototype.remove = function() {
for(var i = 0, len = this.length; i < len; i++) {
if(this[i] && this[i].parentElement) {
this[i].parentElement.removeChild(this[i]);
};
};
};
Date.prototype.yyyymmdd = function() {
var yyyy = this.getFullYear().toString();
var mm = (this.getMonth()+1).toString(); // getMonth() is zero-based
var dd = this.getDate().toString();
return yyyy + '-' + (mm[1]?mm:"0"+mm[0]) + '-' + (dd[1]?dd:"0"+dd[0]);
};
var show_add_form = function () {
var form = document.getElementById("action_form");
var date = document.createElement("input");
date.type = "text";
date.id = "date";
d = new Date();
date.value = d.yyyymmdd();
form.appendChild(date);
var amount = document.createElement("input");
amount.type = "text";
amount.id = "amount";
amount.placeholder="money";
form.appendChild(amount);
var select = document.createElement("select");
select.id = "type";
select.placeholder="in/out";
form.appendChild(select);
var option = document.createElement("option");
option.text = "income";
select.appendChild(option);
var option = document.createElement("option");
option.text = "outcome";
select.appendChild(option);
var description = document.createElement("input");
description.type = "text";
description.id = "desc";
description.placeholder="description of money operation";
form.appendChild(description);
var cancel = document.createElement("input");
cancel.type = "button";
cancel.id = "cancel";
cancel.value = "cancel";
cancel.onclick = function() { hide_add_form(); };
form.appendChild(cancel);
};
var hide_add_form = function() {
var elements = document.getElementById("action_form").elements;
elements.remove();
};
|
|
23.08.2014, 07:33
|
|
Профессор
|
|
Регистрация: 24.09.2013
Сообщений: 1,436
|
|
Ты что-то мудришь. Почему не просто
document.getElementById("action_form").innerHTML = "";
?
Последний раз редактировалось Erolast, 23.08.2014 в 08:13.
|
|
23.08.2014, 12:29
|
Аспирант
|
|
Регистрация: 29.07.2014
Сообщений: 42
|
|
Сообщение от Erolast
|
Ты что-то мудришь. Почему не просто
document.getElementById("action_form").innerHTML = "";
?
|
Хм... неплохо... А сами объекты уничтожатся? Ну, в памяти или где-то ещё ничё висеть не будет?
|
|
23.08.2014, 15:25
|
|
Профессор
|
|
Регистрация: 24.09.2013
Сообщений: 1,436
|
|
Не будет. Сборщик мусора удаляет объект, если исчезли все ссылки на него.
|
|
23.08.2014, 20:45
|
Аспирант
|
|
Регистрация: 29.07.2014
Сообщений: 42
|
|
Большое спасибо, но... зачем-то придумали метод removeChild и всё такое, должно же оно где-использоваться, не?
|
|
23.08.2014, 21:25
|
|
Тлен
|
|
Регистрация: 02.01.2010
Сообщений: 6,587
|
|
Master_Sergius, во многих случаях removeChild проще. innerHTML изначально вообще не подразумевался, его придумал IE, но больно удобным оказался.
А проблема у тебя стнадртная новичковая. NodeList - это именно что коллекция. Живая коллекция. Не массив. Как только ты удаляшь первый элемент - первым на его место становится второй. Соответственно получается удаление через одного. В данном случае используют цикл с обратным перебором.(либо приведение к массиву, либо дополнительные операции с i в цикле, но всё это лишнее)
__________________
29375, 35
Последний раз редактировалось Aetae, 23.08.2014 в 21:28.
|
|
24.08.2014, 15:27
|
Аспирант
|
|
Регистрация: 29.07.2014
Сообщений: 42
|
|
Отличное разъяснение. Большое спасибо. Значит, пока что, действительно попроще юзать innerHTML, но правильнее (на мой взгляд) - removeChild, что мы потом освоим получше )
|
|
24.08.2014, 15:37
|
|
Профессор
|
|
Регистрация: 24.09.2013
Сообщений: 1,436
|
|
Цитата:
|
правильнее (на мой взгляд) - removeChild
|
Разве что с точки зрения семантики. Совсем немножко. Так или иначе, напиши функцию empty, где будет происходить очищение innerHTML, и будет тебе счастье.
|
|
25.08.2014, 00:12
|
|
Тлен
|
|
Регистрация: 02.01.2010
Сообщений: 6,587
|
|
Erolast, ну какбэ NodeList может содержать коллекцию элементов имеющих разных родителей. К тому же эти родители могут содержать и другие элементы, которых нет в конкретной выборке. inneHTML ты в таких случаях никак не применишь.
__________________
29375, 35
|
|
25.08.2014, 05:43
|
|
Профессор
|
|
Регистрация: 24.09.2013
Сообщений: 1,436
|
|
А, ну да. Почему-то решил, что тема только об удалении дочерей какого-либо элемента.
|
|
|
|