javascript - Javascript/html：如何存储 div，并在以后隐藏其子项

Question

我正在存储一个被选中的 div

var selectedCell = null;
    $(".selectableBox").on('click', function (event) {
            selectedCell = $(this);
        }

稍后我想隐藏一个 selectableCell 的子名称 selectableCellChild

$('#deleteConfirmed').on('click', function (event) {

    selectedCellList.($'selectableCellChild').hide();
});

如何正确隐藏此子 div？我知道上面示例的语法不正确，我已经尝试了很多方法，包括使用 selectedCellList 的 children() 和 next() 方法

Answer 1

selectedCellList.find('{selectableCellChild}').hide();

whereselectableCellChild是单元格实际选择器的占位符。

我已经尝试了很多方法，包括使用children()和next()

• children- 只遍历一层。
• find- 深入遍历所有 DOM 级别。
• next选择下一个直接兄弟。

Answer 2

使用.find.

selectedCellList.find('selectableCellChild').hide(); // I hope selectableCellChild isn't your real selector, it won't work

此外，在声明变量时，请将其设为 jQuery 对象，因为您打算在其中存储一个 jquery 对象以避免未定义的方法错误。

var selectedCell = $();

Answer 3

对于第二部分，这就是您想要的：

$('#deleteConfirmed').on('click', function (event) {
    $(selectedCellList).find('.selectableCellChild').hide();
});

Answer 4

如果我理解正确，您正试图隐藏单击的 div 的子级。尝试如下，

var selectedCell = null;
$(".selectableBox").on('click', function (event) {
   selectedCell = $(this);
}); //Your missed );

$('#deleteConfirmed').on('click', function (event) {
   //v-- Changed from selectedCellList to selectedCell as this is the clicked div.
   selectedCell.find('.selectableCellChild').hide(); 
   //assuming selectableCellChild-^ is class of child elements in the clicked div
});