Я использую виджет Гридстер для веб-страницы. У меня есть виджеты, на которых есть изображения. Есть JSON, который дает данные о том, какое изображение должно быть в каждой сетке (я получаю текст из JSON, а затем получаю соответствующее изображение из базы данных). Я хочу кнопка на каждом изображении, которая удалит изображение из виджета, а также удалит соответствующее значение из JSON.
Мой цикл JS, который генерирует виджеты:
for(var index=0;index<json.length;index++) {
{% load static %}
gridster.add_widget('<li class = "new" ><button class = "delete-widget-button" style = "float: right;">-</button><img src = "{% get_static_prefix %}images/'+json[index].html+'"></li>',json[index].size_x,json[index].size_y,json[index].col,json[index].row);
};
Мой JSON
var json = [{
"html": 'abc.png',
"col": 1,
"row": 1,
"size_y": 2,
"size_x": 2
}, {
"html": "xyz.png",
"col": 4,
"row": 1,
"size_y": 2,
"size_x": 2
},
{
"html": "def.png",
"col": 6,
"row": 1,
"size_y": 2,
"size_x": 2
},
{
"html": "abc.png",
"col": 1,
"row": 3,
"size_y": 1,
"size_x": 1
}, {
"html": "def.png",
"col": 4,
"row": 3,
"size_y": 1,
"size_x": 1
},
{
"html": "abc.png ",
"col": 6,
"row": 3,
"size_y": 1,
"size_x": 1
}
];
Мой HTML:
<div class = "gridster">
<ul>
</ul>
</div>
Скрипка - это то, что я пытаюсь сделать
У скрипки есть кнопка для удаления изображения, но она, похоже, не работает, и после удаления изображения я хочу обновить / очистить соответствующую пару значений ключа, а также объект json, из которого оно сгенерировано
Любая помощь будет очень признательна, потому что это, похоже, тема продвинутого уровня JS / JQuery.



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Попробуй это:
$('.removediv').on('click', function () {
$(this).closest('div.imagewrap').remove();
});
Протестировано здесь: JSFiddle
Он также удаляет элемент li. Я поставил кнопку "x", которую хочу удалить изображение.
Это удаляет изображение или просто скрывает его?
заменить hide() на remove()
Спасибо, это решает мою часть вопроса. Но другая часть - я также хочу удалить значение JSON, из которого оно создается. Вот где я вообще не мог думать
Поэтому, когда я снова сгенерирую json, он не будет иметь значения в поле «html», где изображение удаляется.
Также этот вопрос здесь stackoverflow.com/questions/49220256/…
Я использую функцию сериализации для генерации JSON, но не думаю, что здесь это сработает. Для этого понадобится новая функция, которая будет генерировать JSON аналогичной формы.
Позвольте нам продолжить обсуждение в чате.
Я просто хочу знать, как я могу очистить значение ключа "html" при удалении изображения для определенного виджета. Это то, чего я не понимал.
delete window.json[index], предполагая, что json - глобальная переменная
Я имею в виду, что в функции, которая находится в ответе выше, я хочу также получить виджет, из которого вызывается функция. Чтобы я мог удалить "html" этого виджета. Я не могу понять, как передать какие виджеты вызывают эту функцию
Я хочу удалить изображение, а не внешний виджет