Javascript 显示是否隐藏jQuery

我有一个div，如果鼠标悬停在另一个div上，那么当鼠标离开时，div被隐藏

在我的

mousemove

回调函数中，我说

$（“#divToShow”）.show（）

，但是我想知道这是否效率低下，因为

mousemove

事件被频繁触发，如果该div已经显示，那么它会毫无理由地调用

show（）

检查div是否隐藏，然后只显示它会更有效吗？像这样：

if ($('#divToShow').is(":hidden")){
  $('#divToShow').show();
}

或者另一种解决方案是在第一次显示div时将布尔变量设置为true，然后在

mouseleave

上设置为false

---

是否有人知道在

mousemove

函数中显示div的有效方法？

使用mouseEnter设置标志（或仅显示），并在mouseLeave上将标志设置为相反的值（或仅隐藏）。mouseMove可能不是最好的事件，因为它可能被激发得比预期的多。如果只想显示和隐藏某个元素，甚至可能无法跟踪某个标志。

使用mouseEnter设置标志（或仅显示），并在Mouseleve上将标志设置为相反的值（或仅隐藏）。mouseMove可能不是最好的事件，因为它可能被激发得比预期的多。如果您只想显示和隐藏某个元素，您甚至可能无法跟踪某个标志。

首先，我让您检查，然后，在最后，查看我的答案：

show: function() {
        return showHide( this, true );
    }

而

showHide

源代码是：

function showHide( elements, show ) {
    var display, elem, hidden,
        values = [],
        index = 0,
        length = elements.length;

    for ( ; index < length; index++ ) {
        elem = elements[ index ];
        if ( !elem.style ) {
            continue;
        }

        values[ index ] = dataPriv.get( elem, "olddisplay" );
        display = elem.style.display;
        if ( show ) {

            // Reset the inline display of this element to learn if it is
            // being hidden by cascaded rules or not
            if ( !values[ index ] && display === "none" ) {
                elem.style.display = "";
            }

            // Set elements which have been overridden with display: none
            // in a stylesheet to whatever the default browser style is
            // for such an element
            if ( elem.style.display === "" && isHidden( elem ) ) {
                values[ index ] = dataPriv.access(
                    elem,
                    "olddisplay",
                    defaultDisplay( elem.nodeName )
                );
            }
        } else {
            hidden = isHidden( elem );

            if ( display !== "none" || !hidden ) {
                dataPriv.set(
                    elem,
                    "olddisplay",
                    hidden ? display : jQuery.css( elem, "display" )
                );
            }
        }
    }

    // Set the display of most of the elements in a second loop
    // to avoid the constant reflow
    for ( index = 0; index < length; index++ ) {
        elem = elements[ index ];
        if ( !elem.style ) {
            continue;
        }
        if ( !show || elem.style.display === "none" || elem.style.display === "" ) {
            elem.style.display = show ? values[ index ] || "" : "none";
        }
    }

    return elements;
}

函数显示隐藏（元素，显示）{
变量显示、元素、隐藏、，
值=[]，
指数=0，
长度=元素长度；
对于（；索引<长度；索引++）{
elem=元素[索引]；
如果（！elem.style）{
继续；
}
值[索引]=dataPriv.get（elem，“olddisplay”）；
显示=elem.style.display；
如果（显示）{
//重置此元素的内联显示以了解其是否为
//是否被级联规则隐藏
如果（！values[index]&&display==“none”）{
elem.style.display=“”；
}
//设置已被显示覆盖的元素：无
//在样式表中设置为默认浏览器样式
//对于这样一个元素
if（elem.style.display==“”&&isHidden（elem））{
值[索引]=dataPriv.access(
埃伦，
“旧显示器”，
默认显示（elem.nodeName）
);
}
}否则{
隐藏=isHidden（元素）；
如果（显示！=“无”| |！隐藏）{
dataPriv.set(
埃伦，
“旧显示器”，
隐藏？显示：jQuery.css（元素，“显示”）
);
}
}
}
//设置第二个循环中大多数元素的显示
//避免持续回流
对于（索引=0；索引<长度；索引++）{
elem=元素[索引]；
如果（！elem.style）{
继续；
}
如果（！show | | elem.style.display==“无”| | elem.style.display==“无”）{
elem.style.display=show？值[索引]| |“”：“无”；
}
}
返回元素；
}

---

因此：

---

您不需要检查它是否隐藏。

$（）.is（“：hidden”）

，因为它已经在

show

函数中被选中（请参阅：

if（elem.style.display===”&&ishiden（elem））{……

）

首先，我让您检查一下，然后，在最后，看一下我的答案：

show: function() {
        return showHide( this, true );
    }

而

showHide

源代码是：

function showHide( elements, show ) {
    var display, elem, hidden,
        values = [],
        index = 0,
        length = elements.length;

    for ( ; index < length; index++ ) {
        elem = elements[ index ];
        if ( !elem.style ) {
            continue;
        }

        values[ index ] = dataPriv.get( elem, "olddisplay" );
        display = elem.style.display;
        if ( show ) {

            // Reset the inline display of this element to learn if it is
            // being hidden by cascaded rules or not
            if ( !values[ index ] && display === "none" ) {
                elem.style.display = "";
            }

            // Set elements which have been overridden with display: none
            // in a stylesheet to whatever the default browser style is
            // for such an element
            if ( elem.style.display === "" && isHidden( elem ) ) {
                values[ index ] = dataPriv.access(
                    elem,
                    "olddisplay",
                    defaultDisplay( elem.nodeName )
                );
            }
        } else {
            hidden = isHidden( elem );

            if ( display !== "none" || !hidden ) {
                dataPriv.set(
                    elem,
                    "olddisplay",
                    hidden ? display : jQuery.css( elem, "display" )
                );
            }
        }
    }

    // Set the display of most of the elements in a second loop
    // to avoid the constant reflow
    for ( index = 0; index < length; index++ ) {
        elem = elements[ index ];
        if ( !elem.style ) {
            continue;
        }
        if ( !show || elem.style.display === "none" || elem.style.display === "" ) {
            elem.style.display = show ? values[ index ] || "" : "none";
        }
    }

    return elements;
}

函数显示隐藏（元素，显示）{
变量显示、元素、隐藏、，
值=[]，
指数=0，
长度=元素长度；
对于（；索引<长度；索引++）{
elem=元素[索引]；
如果（！elem.style）{
继续；
}
值[索引]=dataPriv.get（elem，“olddisplay”）；
显示=elem.style.display；
如果（显示）{
//重置此元素的内联显示以了解其是否为
//是否被级联规则隐藏
如果（！values[index]&&display==“none”）{
elem.style.display=“”；
}
//设置已被显示覆盖的元素：无
//在样式表中设置为默认浏览器样式
//对于这样一个元素
if（elem.style.display==“”&&isHidden（elem））{
值[索引]=dataPriv.access(
埃伦，
“旧显示器”，
默认显示（elem.nodeName）
);
}
}否则{
隐藏=isHidden（元素）；
如果（显示！=“无”| |！隐藏）{
dataPriv.set(
埃伦，
“旧显示器”，
隐藏？显示：jQuery.css（元素，“显示”）
);
}
}
}
//设置第二个循环中大多数元素的显示
//避免持续回流
对于（索引=0；索引<长度；索引++）{
elem=元素[索引]；
如果（！elem.style）{
继续；
}
如果（！show | | elem.style.display==“无”| | elem.style.display==“无”）{
elem.style.display=show？值[索引]| |“”：“无”；
}
}
返回元素；
}

---

因此：

---

您不需要检查它是否隐藏。

$（）.is（“：hidden”）

，因为它已经在

show

函数中被选中（请参阅：

if（elem.style.display==”&&ishiden（elem））{……

）

更好的解决方案是使用

mouseEnter

和

mouseLeave

，如下所示：

这是javaScript，但会给你一个更好的主意