Question

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

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

我无法使用我用于NDA原因的确切代码，但这里的设置与div中的一些纯文本一样。

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

非常感谢任何帮助。这个网站是一个救生员。

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

<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>

Answer 1

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

Answer 2

这是代码的作用：

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

    e.stopPropagation();
});

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

没有该代码的

Demo。

Answer 3

不是真正的专家但这似乎是错误的部分

$('*').click(function(e) {...............}

jQuery函数没有像我计划的那样工作，DIV只是在点击时消失了

3 个答案: