3

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

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

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

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

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

但是，我有一个复杂而丰富的 UI。这个接口有许多需要这种行为的元素。让我们假设在每个事件中只需要隐藏一个元素。我是否需要每次都遍历整个区域，才能找到我想要隐藏的一个元素？

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

你会怎么办？

4

1 回答 1

1

认为：

  1. 这些元素由 javascript 显示/隐藏。

  2. 规则是越晚出现，越早隐藏。

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

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) {
    ...
}
于 2013-01-28T17:50:02.193 回答