Question

我有一个脚本在点击时显示工具提示，另一个脚本在页面中的某个点后显示一个菜单。

如果菜单没有加载，那么我可以点击按钮来显示工具提示就好了。但是当菜单显示时，工具提示脚本不再显示。

<script>
    $(document).ready(function() {
        $('#left-tooltip').click(function() {
            $('#lollefttooltip').toggle();
        });
    });

    $(document).ready(function() {
        $('#right-tooltip').click(function() {
            $('.right-tooltip').toggle();
        });
    });
</script>
<script>
    $(function() {
        $(window).scroll(function() {
            if ($(this).scrollTop() > 650) {
                $("#nav-block:hidden").css('visibility', 'visible');
                $("#nav-block:hidden").fadeIn('650');
                $("#nav-wrap:hidden").css('visibility', 'visible');
                $("#nav-wrap:hidden").fadeIn('650');
                $("#header-wrap:hidden").css('visibility', 'visible');
                $("#header-wrap:hidden").fadeIn('650');
            } else {
                $("#nav-block:visible").fadeOut("650");
                $("#nav-wrap:visible").fadeOut("650");
                $("#header-wrap:visible").fadeOut("650");
            }
        });
    });
</script>

提前感谢您的帮助！

更新：这是我拥有的所有代码。 http://jsfiddle.net/parachutepenny/82J6G/11/

我很抱歉提前发现任何初学者错误。我还在学习如何编码。

Answer 1

这并没有回答你的问题，但这里有一些很好的优化机会。除了最佳实践，他们也可以解决烦恼。类似的东西：

$(document).ready(function() { // combine doc.ready

    var win  = window, // store window as a variable
        $bod = $('body');

    $('#left-tooltip').click(function() {

        $('#lollefttooltip').toggle();
    });
    $('#right-tooltip').click(function() {

        $('.right-tooltip').toggle();
    });

    $(win).scroll(function() {

        if (win.scrollY > 650) { // use scrollY from window variable so you're not retrieving from the DOM

            $bod.addClass('navVisible'); // use classes on body to trigger CSS transitions on the children
        } else {

            $bod.removeClass('navHidden');
        }
    });
});

Answer 2

将您的多次点击功能置于单一就绪功能中。可能会导致可读性问题。请点击此链接。

Multiple document.ready() function

两个javascript函数不能同时工作

2 个答案: