Javascript -如果div已经显示，不要运行代码？

Question

我已经想出了这个javascript来滑动div。

单击时，它会将所有内容都滑动起来，然后将单击的内容滑动。

问题是，当同一标题在已经打开时被单击时，会导致内容重新滑动，然后再次下降。

如果代码已经显示，那么代码需要什么才能滑动回退？

    function toggle_visibility(id) {
        var thelist = document.getElementsByClassName("alist");
        for (var i = 0; i < thelist.length; i++) {
              $(thelist[i]).slideUp( "slow", function() {});
        }

    //break if the DIV was displayed last!
        var e = document.getElementById(id);
        $( e ).slideDown( "slow", function() {});
    }

Answer 1

您可以测试元素的客户端宽度，以确定它是否可见：

if (document.getElementById(id).clientHeight) return; // already visible

或者，就像您似乎使用jQuery一样：

if ($(e).is(':visible')) return;

Answer 2

function toggle_visibility(id) {
        var thelist = document.getElementsByClassName("alist");
        for (var i = 0; i < thelist.length; i++) {
              $(thelist[i]).slideUp( "slow", function() {});
        }

    //break if the DIV was displayed last!
        var e = document.getElementById(id);
        if (e.style.display != "none") {
            $( e ).slideDown( "slow", function() {});
        }
    }

Answer 3

我认为传递给toggle_visiblity的元素属于alist类。因此，要向下滑动的元素将首先在for循环中向上滑动，然后在循环之后再次向下滑动。在循环中添加一个检查，以检查元素是否可见。如果是的话，只有这样才能滑行。这里发生的情况是，您的元素在循环期间被向上滑动，因为它是列表的一部分，然后在循环之后再次向下滑动。在循环中，您希望滑动不属于alist类型的id元素。