在jQuery中合并两个ready()函数

时间:2012-07-17 11:23:26

标签: jquery jquery-plugins ready

我的HTML文件中有两个$(document).ready(function($)函数。现在因为有两个ready()函数,只有一个执行!由于我对jQuery没有太多了解,我无法合并它们。

<script type="text/javascript">

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

        $('#mega-1').dcVerticalMegaMenu({
            rowItems: '3',
            speed: 'fast',
            effect: 'show',
            direction: 'right'
        });
        $('#mega-2').dcVerticalMegaMenu({
            rowItems: '3',
            speed: 'slow',
            effect: 'fade',
            direction: 'left'
        });
        $('#mega-3').dcVerticalMegaMenu({
            rowItems: '4',
            speed: 'slow',
            effect: 'slide',
            direction: 'right'
        });
        $('#mega-4').dcVerticalMegaMenu({
            rowItems: '3',
            speed: 'fast',
            effect: 'slide',
            direction: 'left'
        });

    });
    </script>

jQuery函数2:

<script type="text/javascript">
    $(document).ready(function(){
        $("#featured > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
    });
</script>

1 个答案:

答案 0 :(得分:1)

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Page Title</title>

<script src="some_javascript_file.js"></script>
<script src="another_js_file.js"></script>

</head>
<body>

<!-- HTML HERE -->


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="jQuery_plugin_1.js"></script>
<script src="jQuery_plugin_2.js"></script>
<script>
(function($){ // remap $ to jQuery

    $(function(){
        $('#mega-1').dcVerticalMegaMenu({
            rowItems: '3',
            speed: 'fast',
            effect: 'show',
            direction: 'right'
        });
        $('#mega-2').dcVerticalMegaMenu({
            rowItems: '3',
            speed: 'slow',
            effect: 'fade',
            direction: 'left'
        });
        $('#mega-3').dcVerticalMegaMenu({
            rowItems: '4',
            speed: 'slow',
            effect: 'slide',
            direction: 'right'
        });
        $('#mega-4').dcVerticalMegaMenu({
            rowItems: '3',
            speed: 'fast',
            effect: 'slide',
            direction: 'left'
        });


        // =====================================

        $("#featured > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);

    });

})(jQuery);
</script>

</body>
</html>