Question

好的，所以我们都知道这种隐藏元素（和多个元素）的方法，当它在它外面点击时（即元素失去焦点）：

$('document').on('click', function () { $(element).hide(); });

$(element).on('click', function (e) { e.stopPropagation(); /* ka-chow! */ });

表示任何到达文档的点击事件都会隐藏元素，而元素内的任何点击都不会传播到文档，也不会触发点击事件。

这一切都很好，绝对不是新闻。

但是，我有一个复杂而丰富的用户界面。此接口具有许多需要此类行为的元素。假设在每个事件中只需要隐藏一个元素。我是否需要每次遍历整个批次，找到我想要隐藏的元素？

如果是这样，最有效的方法是什么？给他们一个独特的班级名称？或者将每个元素的classname / ID / DOM实例存储在一个数组中，并每次循环遍历它？对我来说，每个解决方案听起来都比另一个解决方案效率低。

你会做什么？

Answer 1

假设：

这些元素由javascript显示/隐藏。
规则是它出现的越晚，隐藏得越早。

然后我将维护一个数组来处理它，例如：

var displayedElements = [];

...

// called when you want to display an element
function showUp (ele) {
    // push element into array
    displayedElements.push(ele);
    ...
}

// called when you want to close the last displayed element
function closeOneIfAvailable () {
    var len = displayedElements.length;
    if (len > 0) {
        var idx = len - 1;
        hideIt (displayedElements[idx]);
        displayedElements.splice(idx, 1);
    }
}

// called when you want to hide an element
function hideIt (ele) {
    ...
}

在外面点击隐藏多个元素的最有效方法？

1 个答案: