jquery封装一个tab切换组件

用jquery封装一个tab切换

html结构：

<!--tabs示例-->
    <div class="mytabs">
        <!--选项卡区域-->
        <ul class="tabs-menu">
            <li class="tabsUnSeletedLi cur">选项1</li>
            <li class="tabsUnSeletedLi">选项2</li>
            <li class="tabsUnSeletedLi">选项3</li>
        </ul>
        <!--面板区域-->
        <div class="tabs-content">
            <div class="tabsDiv show">11111</div>
            <div class="tabsDiv hide">22222</div>
            <div class="tabsDiv hide">33333</div>
        </div>
    </div>

代码：

<script type="text/javascript">
        /*
         * @func tabs封装 放在公共js里面
         * @desc 选项卡切换
         * @param {Object} menu - document对象
         * @param {Object} cont - 内容区容器
         * @param {string} cur - 选择时状态类命名
         */
        function tabs(menu,cont,cur){
            menu.click(function() {
                var index = menu.index(this);
                $(this).addClass(cur).siblings().removeClass(cur);
                cont.children().eq(index).fadeIn().siblings().hide();
            });
        }

        /*单个js调用*/
        $(document).ready(function() {
            //tab切换
            tabs($('.tabs-menu li'), $('.tabs-content'),'cur');
        });
    </script>