迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
开源软件名称:bootStrap-addTabs开源软件地址:https://gitee.com/hbbcs/bootStrap-addTabs开源软件介绍:评论关闭如果有意见或建议请到Issues中发表。 DemoDemo Url UPDATE
UsageSTEP 1、引入文件 <link rel="stylesheet" href="./bootstrap.addtabs.css" type="text/css" media="screen" /><script type="text/javascript" src="./bootstrap.addtabs.js"></script> STEP 2、设置按钮或链接 <a class="list-group-item" data-addtab="userMenu1" data-target="#tabs2" data-url="./example/ajax/mailbox.txt"> 用户菜单1</a> 或使用标准的json <a class="list-group-item" data-addtab='{"id":"mail","url": "./example/ajax/button.html","target": "#tabs1"}'> 用户菜单2</a> ajax调用方式 <a class="list-group-item" data-addtab="mail1" data-ajax='{"async":false}' data-url="example/ajax/mailbox.txt"> Use Ajax</a> json可用参数 { "id": string, "target": string|object, "title": string, "content": string, //设置content,url将不起作用 "url": string, "ajax": json} 至此就可以使用此插件。 关闭所有增加的TAB $('#closeAll1').click(function () { $.addtabs.closeAll('#tabs1');}) 子窗口不加载bootstrap-addtabs的环境下,在父窗口增加TAB。 $('#testbutton').click(function() { window.parent.window.$.addtabs.add({ target: "#tabs1", url: "example/ajax/mailbox.txt", title: "test" });}) iframe子窗口关闭父窗口的TABS $(function() { window.parent.window.$.addtabs.close('#tab_message');}) 参数 target string|object 同一页面如果存在多个nav-tabs,可以使用此参数设定增加TAB的目标content string|html 直接指定内容close bool 是否可以关闭,默认是truemonitor string 监视的区域,默认是bodyiframe bool 使用iframe,false使用ajax,默认trueiframeHeight num 固定TAB中IFRAME高度callback function(){} 关闭后回调函数contextmenu bool 是否启用右键菜单,默认trueloadbar bool 是否显示加载条,默认是truestore bool 将打开的tab页记录到客户端存储中,刷新页面时自动打开,默认使用ajax object 全局调用ajax的默认参数local:{ 'refreshLabel': '刷新此标签', 'closeThisLabel': '关闭此标签', 'closeOtherLabel': '关闭其他标签', 'closeLeftLabel': '关闭左侧标签', 'closeRightLabel': '关闭右侧标签', 'loadbar': '正在加载内容,请稍候...'} 设置方法 $.addtabs({"target":"#tabs1",...}) 或 $.addtabs.set({"target":"#tabs1"}); 或 $.addtabs.set("target","#tabs1"); ![]() |
2022-08-15
2022-08-17
2023-10-27
2022-09-23
2022-08-13
请发表评论