jQuery函数并没有按我的计划工作，DIV只是在点击时消失

jQuery function is not working as I planned, DIVs just disappear on click

本文关键字：消失 DIV 并没有 函数 我的 工作 计划 jQuery      更新时间：2023-09-26

我这里有一个脚本，除了一个小细节外，它的效果非常好。它基本上是作为点击功能运行的，点击链接时会淡入和淡出某些DIV。

然而，问题是，当您单击页面上的ANYWHERE时，它会删除DIV并留下一个空的内容区域，直到您单击其中一个链接。显然这是个问题。

由于NDA的原因，我无法使用我正在使用的确切代码，但这里是我在div中使用的相同设置，只是一些纯文本。

只需单击链接即可查看功能，然后单击页面上的其他任何位置（在div中，在空白处，无论什么地方），即可看到div消失。我知道JavaScript就是这么调用的，但我不知道如何禁用div中的点击，所以不会发生这种情况。此外，如何做到这一点，这样它就不会禁用该分区内的链接。

非常感谢您的帮助。这个网站是一个救命稻草。

这是我从这个网站上编辑的原始代码，用来显示我的基本布局。基本上是一堆内联的链接，当点击时，它们会将DIVS的一部分更改为另一部分：

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    var gLastH = null;
    var gLastId = null;
    $('.toggle').click(function(e) {
        $('.toggleh:visible').fadeOut('slow');
        gLastId = $(this).attr('id');
        console.log('#' + gLastId + 'h');
        gLastH = $('#' + gLastId + 'h');
        $(gLastH).fadeIn('slow');
        e.stopPropagation();
    });
    $('*').click(function(e) {
        if ($(this).attr('id') != gLastId) {
            $(gLastH).fadeOut('slow');
        }
        e.stopPropagation();
    });
});
</script>
</head>
<body>
<div id="menubar">
    
    <a href="#" onclick="return false;" class="toggle" id="toggle1" style="display: inline;">
        text here</a>
    <a href="#" onclick="return false;" class="toggle" id="toggle2" style="display: inline;">
        text here</a>
    <a href="#" onclick="return false;" class="toggle" id="toggle3" style="display: inline;">
        text here</a>
    <a href="#" onclick="return false;" class="toggle" id="toggle4" style="display: inline;">
        text here</a>
    <div class="toggleh" id="toggle1h">
        some description in here I suppose
    </div>
   
    <div class="toggleh" id="toggle2h" style="display: none;">
        some description in here I suppose #2dsfds  sdfdsfa sdf 
    </div>
  
    <div class="toggleh" id="toggle3h" style="display: none;">
        some description in here I suppose #3dffdfasdfdsfdfasf
    </div>
   
    <div class="toggleh" id="toggle4h" style="display: none;">
        some description in here I suppose #4 dfdafa
    </div>
</div>
</body>
</html>

$('*').click(...为所有元素（*）设置一个点击处理程序。您可以删除此功能。

这就是这个代码的作用：

$('*').click(function(e) {
    if (this.id != gLastId) {
        $(gLastH).fadeOut('slow');
    }
    e.stopPropagation();
});

它选择文档中的所有元素（包括html、head和body），并为其附加一个单击处理程序。当您单击文档时，它会比较可能为空的id，然后淡出显示的div。

没有那个代码的演示。

不是真正的专家但这似乎是的故障部分

$('*').click(function(e) {...............}
相关文章：