zoukankan      html  css  js  c++  java
  • easyui菜单栏的使用

    <div id="tabs" class="easyui-tabs" data-options="plain:true,fit:true,border:'false'">
    </div>
    <div id="mm" class="easyui-menu" style="150px;">
            <div id="tabupdate">刷新</div>
            <div class="menu-sep"></div>
            <div id="mm-tabclose">关闭</div>
            <div id="mm-tabcloseall">关闭全部</div>
            <div id="mm-tabcloseother">关闭其他</div>
            <div class="menu-sep"></div>
            <div id="mm-tabcloseright">关闭右侧标签</div>
            <div id="mm-tabcloseleft">关闭左侧标签</div>
        </div>
    
    
            $(function () {
                bindTabEvent();
                bindTabMenuEvent();
            });
    
            //绑定tab的双击事件、右键事件
            function bindTabEvent() {
                $(".tabs-inner").live('dblclick', function () {
                    var subtitle = $(this).children("span").text();
                    if ($(this).next().is('.tabs-close')) {
                        $('#tabs').tabs('close', subtitle);
                    }
                });
                $(".tabs-inner").live('contextmenu', function (e) {
                    $('#mm').menu('show', {
                        left: e.pageX,
                        top: e.pageY
                    });
                    var subtitle = $(this).children("span").text();
                    $('#mm').data("currtab", subtitle);
             
     $('#tabs').tabs('select', subtitle);//右击时触发切换选
    return false;
                });
            }
            //绑定tab右键菜单事件
            function bindTabMenuEvent() {
                //刷新
                $('#tabupdate').click(function () {
                    var currentTab = $('#tabs').tabs('getSelected');
                    var iframe = $(currentTab.panel('options').content);
                    var url = iframe.attr('src');//获得连接
                    var title = currentTab.panel('options').title;//获得表头信息
                    var content = "<iframe scrolling='auto' frameborder='0'  src='"
                            + url + "' style='100%;height:100%;'></iframe>";
    
                    $('#tabs').tabs('update', {
                        tab: currentTab,
                        options: {
                            content: content
                        }
                    });
                });
                //关闭当前
                $('#mm-tabclose').click(function () {
                    var currtab_title = $('#mm').data("currtab");
                    $('#tabs').tabs('close', currtab_title);
                });
                //全部关闭
                $('#mm-tabcloseall').click(function () {
                    $('.tabs-inner span').each(function (i, n) {
                        if ($(this).parent().next().is('.tabs-close')) {
                            var t = $(n).text();
                            $('#tabs').tabs('close', t);
                        }
                    });
                });
                //关闭除当前之外的TAB
                $('#mm-tabcloseother').click(function () {
                    var currtab_title = $('#mm').data("currtab");
                    $('.tabs-inner span').each(function (i, n) {
                        if ($(this).parent().next().is('.tabs-close')) {
                            var t = $(n).text();
                            if (t != currtab_title)
                                $('#tabs').tabs('close', t);
                        }
                    });
                });
                //关闭当前右侧的TAB
                $('#mm-tabcloseright').click(function () {
                    var nextall = $('.tabs-selected').nextAll();
                    if (nextall.length == 0) {
                        alert('已经是最后一个了');
                        return false;
                    }
                    nextall.each(function (i, n) {
                        if ($('a.tabs-close', $(n)).length > 0) {
                            var t = $('a:eq(0) span', $(n)).text();
                            $('#tabs').tabs('close', t);
                        }
                    });
                    return false;
                });
                //关闭当前左侧的TAB
                $('#mm-tabcloseleft').click(function () {
                    var prevall = $('.tabs-selected').prevAll();
                    if (prevall.length == 1) {
                        alert('已经是第一个了');
                        return false;
                    }
                    prevall.each(function (i, n) {
                        if ($('a.tabs-close', $(n)).length > 0) {
                            var t = $('a:eq(0) span', $(n)).text();
                            $('#tabs').tabs('close', t);
                        }
                    });
                    return false;
                });
            }
    function addTab(title, url) {
                if ($('#tabs').tabs('exists', title)) {
                    $('#tabs').tabs('select', title);
                } else {
                    var content = "<iframe scrolling='auto' frameborder='0'  src='"
                            + url + "' style='100%;height:100%;'></iframe>";
                    $('#tabs').tabs('add', {
                        title: title,
                        content: content,
                        closable: true,
                        iconCls: 'icon-add'
                    });
                }
            };
  • 相关阅读:
    Javascript之旅——第七站:说说js的调试
    Javascript之旅——第六站:看看writable特性
    Javascript之旅——第五站:说说那些所谓的包装类型
    Javascript之旅——第四站:parseInt中要注意的坑
    Javascript之旅——第三站:几个需要注意的运算符
    Javascript之旅——第二站:对象和数组
    Javascript之旅——第一站:从变量说起
    学习和使用 PHP 应该注意的10件事
    8/7排位赛,codeforces501
    8.7排位赛,codeforces501
  • 原文地址:https://www.cnblogs.com/zhao123/p/3660154.html
Copyright © 2011-2022 走看看