Question

Hey对jquery世界有点新意但是我想知道，我可以将所有jquery嵌套在一个无冲突之下，还是我必须继续为每一段代码添加无冲突...（因为我现在就拥有它。）

使用Wordpress，因此必须使用无冲突的jquery代码。

jQuery(document).ready(function($) {
    //Modal contact pop-up
    $(".modal-pop").click(function() {
        $("#myModal").modal();
    });
    $(".email").click(function() {
        $("#myModal").modal();
    });
});

//Navbar fixed top on scroll
jQuery(document).ready(function($) {
    $(document).ready(function() {
        var menu = $('#site-nav');
        var origOffsetY = menu.offset().top;

        function scroll() {
            if ($(window).scrollTop() >= origOffsetY) {
                $('#site-nav').addClass('navbar-fixed-top');
                $('.main-content').addClass('menu-padding');
            } else {
                $('#site-nav').removeClass('navbar-fixed-top');
                $('.main-content').removeClass('menu-padding');
            }
        }

        document.onscroll = scroll;
    });
});

//Image Overlay for Images in Portfolio section
jQuery(document).ready(function($) {
    $(function() {
        // OPACITY OF BUTTON SET TO 0%
        $(".roll").css("opacity", "0");
        // ON MOUSE OVER
        $(".roll").hover(function() {
                // SET OPACITY TO 70%
                $(this).stop().animate({
                    opacity: .7
                }, "slow");
            },
            // ON MOUSE OUT
            function() {
                // SET OPACITY BACK TO 50%
                $(this).stop().animate({
                    opacity: 0
                }, "slow");
            });
    });
});

//Smooth scrool to section
jQuery(document).ready(function($) {
    $(function() {
        $('a[href*="#"]:not([href="#"])').click(function() {
            if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
                var target = $(this.hash);
                target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
                if (target.length) {
                    $('html, body').animate({
                        scrollTop: target.offset().top
                    }, 1000);
                    return false;
                }
            }
        });
    });
});

Answer 1

是的，你可以把它全部包装在一起。

jQuery(document).ready(function($) {

    //do a thing

    //do another thing

});

Answer 2

是的，您可以并且可能应该将它们全部包装在一个ready event中。将它们全部包装在自己的包装中是没用的。显然，只有将所有这些放在一个文件中才会发生这种情况。另请注意，the scope现已更改！

jQuery(document).ready(function($) {
    //Modal contact pop-up
    $(".modal-pop").click(function() {
        $("#myModal").modal();
    });
    $(".email").click(function() {
        $("#myModal").modal();
    });

    //Navbar fixed top on scroll    
    function scroll() {
        var menu = $('#site-nav'),
            origOffsetY = menu.offset().top;
        if ($(window).scrollTop() >= origOffsetY) {
            menu.addClass('navbar-fixed-top');
            $('.main-content').addClass('menu-padding');
        } else {
            menu.removeClass('navbar-fixed-top');
            $('.main-content').removeClass('menu-padding');
        }
    }

    document.onscroll = scroll;

    //Image Overlay for Images in Portfolio section
    // OPACITY OF BUTTON SET TO 0%
    $(".roll").css("opacity", "0");
    // ON MOUSE OVER
    $(".roll").hover(function() {
            // SET OPACITY TO 70%
            $(this).stop().animate({
                opacity: .7
            }, "slow");
        },
        // ON MOUSE OUT
        function() {
            // SET OPACITY BACK TO 50%
            $(this).stop().animate({
                opacity: 0
            }, "slow");
        });

    //Smooth scrool to section
    $('a[href*="#"]:not([href="#"])').click(function() {
        if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
            var target = $(this.hash);
            target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
            if (target.length) {
                $('html, body').animate({
                    scrollTop: target.offset().top
                }, 1000);
                return false;
            }
        }
    });
});

嵌套的无冲突Jquery

2 个答案: