123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662 |
- layui.define(['jquery', 'element'], function(exports) {
- "use strict";
-
- var MOD_NAME = 'tab',
- $ = layui.jquery,
- element = layui.element;
-
- var pearTab = function(opt) {
- this.option = opt;
- };
-
- var tabData = new Array();
- var tabDataCurrent = 0;
- var contextTabDOM;
-
- pearTab.prototype.render = function(opt) {
-
- var option = {
- elem: opt.elem,
- data: opt.data,
- tool: opt.tool,
- roll: opt.roll,
- index: opt.index,
- width: opt.width,
- height: opt.height,
- tabMax: opt.tabMax,
- session: opt.session ? opt.session : false,
- preload: opt.preload ? opt.preload : false,
- closeEvent: opt.closeEvent,
- success: opt.success ? opt.success : function(id) {}
- }
-
- if (option.session) {
- if (sessionStorage.getItem(option.elem + "-pear-tab-data") != null) {
- tabData = JSON.parse(sessionStorage.getItem(option.elem + "-pear-tab-data"));
- option.data = JSON.parse(sessionStorage.getItem(option.elem + "-pear-tab-data"));
- tabDataCurrent = sessionStorage.getItem(option.elem + "-pear-tab-data-current");
- tabData.forEach(function(item, index) {
- if (item.id == tabDataCurrent) {
- option.index = index;
- }
- })
- } else {
- tabData = opt.data;
- }
- }
-
- var lastIndex;
- var tab = createTab(option);
- $("#" + option.elem).html(tab);
- $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-prev").click(function() {
- rollPage("left", option);
- })
- $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-next").click(function() {
- rollPage("right", option);
- })
- element.init();
- toolEvent(option);
- $("#" + option.elem).width(opt.width);
- $("#" + option.elem).height(opt.height);
- $("#" + option.elem).css({
- position: "relative"
- });
- closeEvent(option);
-
- option.success(sessionStorage.getItem(option.elem + "-pear-tab-data-current"));
-
- $("body .layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title").on("contextmenu", "li",
- function(e) {
- // 获取当前元素位置
- var top = e.clientY;
- var left = e.clientX;
- var menuWidth = 100;
- var currentId = $(this).attr("lay-id");
- var menu = "<ul><li class='item' id='" + option.elem +
- "closeThis'>关闭当前</li><li class='item' id='" + option.elem +
- "closeOther'>关闭其他</li><li class='item' id='" + option.elem +
- "closeAll'>关闭所有</li></ul>";
-
- contextTabDOM = $(this);
- var isOutsideBounds = (left + menuWidth) > $(window).width();
- if (isOutsideBounds) {
- left = $(window).width() - menuWidth;
- }
- // 初始化
- layer.open({
- type: 1,
- title: false,
- shade: false,
- skin: 'pear-tab-menu',
- closeBtn: false,
- area: [menuWidth + 'px', '108px'],
- fixed: true,
- anim: false,
- isOutAnim: false,
- offset: [top, left],
- content: menu, //iframe的url,
- success: function(layero, index) {
- layer.close(lastIndex);
- lastIndex = index;
- menuEvent(option, index);
- var timer;
- $(layero).on('mouseout', function() {
- timer = setTimeout(function() {
- layer.close(index);
- }, 30)
- });
-
- $(layero).on('mouseover', function() {
- clearTimeout(timer);
- });
-
- // 清除 item 右击
- $(layero).on('contextmenu', function() {
- return false;
- })
-
- }
- });
- return false;
- })
-
- mousewheelAndTouchmoveHandler(option)
- return new pearTab(option);
- }
-
- pearTab.prototype.click = function(callback) {
- var elem = this.option.elem;
- var option = this.option;
- element.on('tab(' + this.option.elem + ')', function(data) {
- var id = $("#" + elem + " .layui-tab-title .layui-this").attr("lay-id");
- sessionStorage.setItem(option.elem + "-pear-tab-data-current", id);
- if (!option.preload) {
- var $iframe = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-content").find(
- "iframe[id='" + id + "']");
- var iframeUrl = $iframe.attr("src");
- if (!iframeUrl || iframeUrl === "about:blank") {
- // 获取 url 并重载
- tabData.forEach(function(item, index) {
- if (item.id === id) {
- iframeUrl = item.url;
- }
- })
- tabIframeLoading(elem);
- $iframe.attr("src", iframeUrl);
- }
- }
- callback(id);
- });
- }
-
- pearTab.prototype.positionTab = function() {
- var $tabTitle = $('.layui-tab[lay-filter=' + this.option.elem + '] .layui-tab-title');
- var autoLeft = 0;
- $tabTitle.children("li").each(function() {
- if ($(this).hasClass('layui-this')) {
- return false;
- } else {
- autoLeft += $(this).outerWidth();
- }
- });
- $tabTitle.animate({
- scrollLeft: autoLeft - $tabTitle.width() / 3
- }, 200);
- }
-
- pearTab.prototype.clear = function() {
- sessionStorage.removeItem(this.option.elem + "-pear-tab-data");
- sessionStorage.removeItem(this.option.elem + "-pear-tab-data-current");
- }
-
- pearTab.prototype.addTab = function(opt) {
- var title = '';
- if (opt.close) {
- title += '<span class="pear-tab-active"></span><span class="able-close title">' + opt.title +
- '</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>';
- } else {
- title += '<span class="pear-tab-active"></span><span class="disable-close title">' + opt.title +
- '</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>';
- }
- element.tabAdd(this.option.elem, {
- title: title,
- content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id +
- '" scrolling="auto" frameborder="0" src="' +
- opt.url + '" style="width:100%;height:100%;" allowfullscreen="true"></>',
- id: opt.id
- });
- tabData.push(opt);
- sessionStorage.setItem(this.option.elem + "-pear-tab-data", JSON.stringify(tabData));
- sessionStorage.setItem(this.option.elem + "-pear-tab-data-current", opt.id);
- element.tabChange(this.option.elem, opt.id);
- }
-
- var index = 0;
- // 根据过滤 fliter 标识, 重置选项卡标题
- pearTab.prototype.changeTabTitleById = function(elem, id, title) {
- var currentTab = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title [lay-id='" + id +
- "'] .title");
- currentTab.html(title);
- }
-
- // 根据过滤 filter 标识, 删除指定选项卡
- pearTab.prototype.delTabByElem = function(elem, id, callback) {
- var currentTab = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title [lay-id='" + id + "']");
- if (currentTab.find("span").is(".able-close")) {
- tabDelete(elem, id, callback);
- }
- }
- // 根据过滤 filter 标识, 删除其他选项卡
- pearTab.prototype.delOtherTabByElem = function(elem, callback) {
- var currentId = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title .layui-this").attr(
- "lay-id");
- var tabtitle = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title li");
- $.each(tabtitle, function(i) {
- if ($(this).attr("lay-id") != currentId) {
- if ($(this).find("span").is(".able-close")) {
- tabDelete(elem, $(this).attr("lay-id"), callback);
- }
- }
- })
- }
-
- // 根据过滤 filter 标识, 删除全部选项卡
- pearTab.prototype.delAllTabByElem = function(elem, callback) {
- var currentId = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title .layui-this").attr(
- "lay-id");
- var tabtitle = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title li");
- $.each(tabtitle, function(i) {
- if ($(this).find("span").is(".able-close")) {
- tabDelete(elem, $(this).attr("lay-id"), callback);
- }
- })
- }
- // 根据过滤 filter 标识, 删除当前选项卡
- pearTab.prototype.delCurrentTabByElem = function(elem, callback) {
- var currentTab = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title .layui-this");
- if (currentTab.find("span").is(".able-close")) {
- var currentId = currentTab.attr("lay-id");
- tabDelete(elem, currentId, callback);
- }
- }
-
- // 通过过滤 filter 标识, 新增标签页
- pearTab.prototype.addTabOnlyByElem = function(elem, opt, time) {
- var title = '';
- if (opt.close) {
- title += '<span class="pear-tab-active"></span><span class="able-close title">' + opt.title +
- '</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>'
- } else {
- title += '<span class="pear-tab-active"></span><span class="disable-close title">' + opt.title +
- '</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>'
- }
- if ($(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title li[lay-id]").length <= 0) {
- element.tabAdd(elem, {
- title: title,
- content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id +
- '" scrolling="auto" frameborder="0" src="' +
- opt.url + '" style="width:100%;height:100%;" allowfullscreen="true"></iframe>',
- id: opt.id
- });
- if (time != false && time != 0) {
- tabIframeLoading(elem, opt.id);
- }
- tabData.push(opt);
- sessionStorage.setItem(elem + "-pear-tab-data", JSON.stringify(tabData));
- } else {
- var isData = false;
- $.each($(".layui-tab[lay-filter='" + elem + "'] .layui-tab-title li[lay-id]"), function() {
- if ($(this).attr("lay-id") == opt.id) {
- isData = true;
- }
- })
-
- if (isData == false) {
- element.tabAdd(elem, {
- title: title,
- content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id +
- '" scrolling="auto" frameborder="0" src="' +
- opt.url + '" style="width:100%;height:100%;" allowfullscreen="true"></iframe>',
- id: opt.id
- });
- if (time != false && time != 0) {
- tabIframeLoading(elem, opt.id);
- }
- tabData.push(opt);
- sessionStorage.setItem(elem + "-pear-tab-data", JSON.stringify(tabData));
-
- }
- }
- sessionStorage.setItem(elem + "-pear-tab-data-current", opt.id);
- element.tabChange(elem, opt.id);
- }
-
- /** 添 加 唯 一 选 项 卡 */
- pearTab.prototype.addTabOnly = function(opt, time) {
- var title = '';
- if (opt.close) {
- title += '<span class="pear-tab-active"></span><span class="able-close title">' + opt.title +
- '</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>';
- } else {
- title += '<span class="pear-tab-active"></span><span class="disable-close title">' + opt.title +
- '</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i>';
- }
- if ($(".layui-tab[lay-filter='" + this.option.elem + "'] .layui-tab-title li[lay-id]").length <=
- 0) {
- element.tabAdd(this.option.elem, {
- title: title,
- content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id +
- '" scrolling="auto" frameborder="0" src="' +
- opt.url + '" style="width:100%;height:100%;" allowfullscreen="true"></iframe>',
- id: opt.id
- });
- if (time != false && time != 0) {
- tabIframeLoading(this.option.elem, opt.id);
- }
- tabData.push(opt);
- sessionStorage.setItem(this.option.elem + "-pear-tab-data", JSON.stringify(tabData));
- sessionStorage.setItem(this.option.elem + "-pear-tab-data-current", opt.id);
- } else {
- var isData = false;
- $.each($(".layui-tab[lay-filter='" + this.option.elem + "'] .layui-tab-title li[lay-id]"),
- function() {
- if ($(this).attr("lay-id") == opt.id) {
- isData = true;
- }
- })
- if (isData == false) {
-
- if (this.option.tabMax != false) {
- if ($(".layui-tab[lay-filter='" + this.option.elem + "'] .layui-tab-title li[lay-id]")
- .length >= this.option.tabMax) {
- layer.msg("最多打开" + this.option.tabMax + "个标签页", {
- icon: 2,
- time: 1000,
- shift: 6
- });
- return false;
- }
- }
-
- element.tabAdd(this.option.elem, {
- title: title,
- content: '<iframe id="' + opt.id + '" data-frameid="' + opt.id +
- '" scrolling="auto" frameborder="0" src="' +
- opt.url + '" style="width:100%;height:100%;" allowfullscreen="true"></iframe>',
- id: opt.id
- });
- if (time != false && time != 0) {
- tabIframeLoading(this.option.elem, opt.id);
- }
- tabData.push(opt);
- sessionStorage.setItem(this.option.elem + "-pear-tab-data", JSON.stringify(tabData));
- sessionStorage.setItem(this.option.elem + "-pear-tab-data-current", opt.id);
- }
- }
- element.tabChange(this.option.elem, opt.id);
- sessionStorage.setItem(this.option.elem + "-pear-tab-data-current", opt.id);
- }
-
- // 刷 新 指 定 的 选 项 卡
- pearTab.prototype.refresh = function(time) {
- // 刷 新 指 定 的 选 项 卡
- var $iframe = $(".layui-tab[lay-filter='" + this.option.elem + "'] .layui-tab-content .layui-show")
- .find("iframe");
- if (time != false && time != 0) {
- tabIframeLoading(this.option.elem);
- }
- $iframe.attr("src", $iframe.attr("src"));
- }
-
- function tabIframeLoading(elem, id) {
- var load = '<div id="pear-tab-loading' + index + '" class="pear-tab-loading">' +
- '<div class="ball-loader">' +
- '<span></span><span></span><span></span><span></span>' +
- '</div>' +
- '</div>'
- var $iframe = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-content .layui-show").find("iframe");
- if (id) {
- $iframe = $(".layui-tab[lay-filter='" + elem + "'] .layui-tab-content").find("iframe[id='" + id +
- "']");
- }
- $iframe.parent().append(load);
- var pearLoad = $("#" + elem).find("#pear-tab-loading" + index);
- pearLoad.css({
- display: "block"
- });
- index++;
- $iframe.on("load", function() {
- pearLoad.fadeOut(1000, function() {
- pearLoad.remove();
- });
- })
- }
-
- function tabDelete(elem, id, callback, option) {
- //根据 elem id 来删除指定的 layui title li
- var tabTitle = $(".layui-tab[lay-filter='" + elem + "']").find(".layui-tab-title");
-
- // 删除指定 id 的 title
- var removeTab = tabTitle.find("li[lay-id='" + id + "']");
- var nextNode = removeTab.next("li");
- if (!removeTab.hasClass("layui-this")) {
- removeTab.remove();
- var tabContent = $(".layui-tab[lay-filter='" + elem + "']").find("iframe[id='" + id + "']")
- .parent();
- tabContent.remove();
-
- tabData = JSON.parse(sessionStorage.getItem(elem + "-pear-tab-data"));
- tabDataCurrent = sessionStorage.getItem(elem + "-pear-tab-data-current");
- tabData = tabData.filter(function(item) {
- return item.id != id;
- })
- sessionStorage.setItem(elem + "-pear-tab-data", JSON.stringify(tabData));
- return false;
- }
-
- var currId;
- if (nextNode.length) {
- nextNode.addClass("layui-this");
- currId = nextNode.attr("lay-id");
- $("#" + elem + " [id='" + currId + "']").parent().addClass("layui-show");
- } else {
- var prevNode = removeTab.prev("li");
- prevNode.addClass("layui-this");
- currId = prevNode.attr("lay-id");
- $("#" + elem + " [id='" + currId + "']").parent().addClass("layui-show");
- }
- callback(currId);
- tabData = JSON.parse(sessionStorage.getItem(elem + "-pear-tab-data"));
- tabDataCurrent = sessionStorage.getItem(elem + "-pear-tab-data-current");
- tabData = tabData.filter(function(item) {
- return item.id != id;
- })
- sessionStorage.setItem(elem + "-pear-tab-data", JSON.stringify(tabData));
- sessionStorage.setItem(elem + "-pear-tab-data-current", currId);
-
- removeTab.remove();
- // 删除 content
- var tabContent = $(".layui-tab[lay-filter='" + elem + "']").find("iframe[id='" + id + "']").parent();
- // 删除
- tabContent.remove();
- }
-
- function createTab(option) {
-
- var type = "";
- if (option.roll == true) {
- type = "layui-tab-roll";
- }
- if (option.tool != false) {
- type = "layui-tab-tool";
- }
- if (option.roll == true && option.tool != false) {
- type = "layui-tab-rollTool";
- }
- var tab = '<div class="pear-tab ' + type + ' layui-tab" lay-filter="' + option.elem +
- '" lay-allowClose="true">';
- var title = '<ul class="layui-tab-title">';
- var content = '<div class="layui-tab-content">';
- var control =
- '<div class="layui-tab-control"><li class="layui-tab-prev layui-icon layui-icon-left"></li><li class="layui-tab-next layui-icon layui-icon-right"></li><li class="layui-tab-tool layui-icon layui-icon-down"><ul class="layui-nav" lay-filter=""><li class="layui-nav-item"><a href="javascript:;"></a><dl class="layui-nav-child">';
-
- // 处 理 选 项 卡 头 部
- var index = 0;
- $.each(option.data, function(i, item) {
- var TitleItem = '';
- if (option.index == index) {
- TitleItem += '<li lay-id="' + item.id +
- '" class="layui-this"><span class="pear-tab-active"></span>';
- } else {
- TitleItem += '<li lay-id="' + item.id + '" ><span class="pear-tab-active"></span>';
- }
-
- if (item.close) {
- // 当 前 选 项 卡 可 以 关 闭
- TitleItem += '<span class="able-close title">' + item.title + '</span>';
- } else {
- // 当 前 选 项 卡 不 允 许 关 闭
- TitleItem += '<span class="disable-close title">' + item.title + '</span>';
- }
- TitleItem += '<i class="layui-icon layui-unselect layui-tab-close">ဆ</i></li>';
- title += TitleItem;
- if (option.index == index) {
-
- // 处 理 显 示 内 容
- content += '<div class="layui-show layui-tab-item"><iframe id="' + item.id +
- '" data-frameid="' + item.id +
- '" src="' + item.url +
- '" frameborder="no" border="0" marginwidth="0" marginheight="0" style="width: 100%;height: 100%;" allowfullscreen="true"></iframe></div>'
- } else {
- if (!option.preload) {
- item.url = "about:blank";
- }
- // 处 理 显 示 内 容
- content += '<div class="layui-tab-item"><iframe id="' + item.id + '" data-frameid="' +
- item.id + '" src="' +
- item.url +
- '" frameborder="no" border="0" marginwidth="0" marginheight="0" style="width: 100%;height: 100%;" allowfullscreen="true"></iframe></div>'
- }
- index++;
- });
-
- title += '</ul>';
- content += '</div>';
- control += '<dd id="closeThis"><a href="#">关 闭 当 前</a></dd>'
- control += '<dd id="closeOther"><a href="#">关 闭 其 他</a></dd>'
- control += '<dd id="closeAll"><a href="#">关 闭 全 部</a></dd>'
- control += '</dl></li></ul></li></div>';
-
- tab += title;
- tab += control;
- tab += content;
- tab += '</div>';
- tab += ''
- return tab;
- }
-
- function rollPage(d, option) {
- var $tabTitle = $('#' + option.elem + ' .layui-tab-title');
- var left = $tabTitle.scrollLeft();
- if ('left' === d) {
- $tabTitle.animate({
- scrollLeft: left - 450
- }, 200);
- } else {
- $tabTitle.animate({
- scrollLeft: left + 450
- }, 200);
- }
- }
-
- function closeEvent(option) {
- $(".layui-tab[lay-filter='" + option.elem + "']").on("click", ".layui-tab-close", function() {
- var layid = $(this).parent().attr("lay-id");
- tabDelete(option.elem, layid, option.closeEvent, option);
- })
- }
-
- function menuEvent(option, index) {
-
- $("#" + option.elem + "closeThis").click(function() {
- var currentTab = contextTabDOM;
-
- if (currentTab.find("span").is(".able-close")) {
- var currentId = currentTab.attr("lay-id");
- tabDelete(option.elem, currentId, option.closeEvent, option);
- } else {
- layer.msg("当前页面不允许关闭", {
- icon: 3,
- time: 800
- })
- }
- layer.close(index);
- })
-
- $("#" + option.elem + "closeOther").click(function() {
- var currentId = contextTabDOM.attr("lay-id");
- var tabtitle = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title li");
- $.each(tabtitle, function(i) {
- if ($(this).attr("lay-id") != currentId) {
- if ($(this).find("span").is(".able-close")) {
- tabDelete(option.elem, $(this).attr("lay-id"), option.closeEvent,
- option);
- }
- }
- })
- layer.close(index);
- })
-
- $("#" + option.elem + "closeAll").click(function() {
- var currentId = contextTabDOM.attr("lay-id");
- var tabtitle = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title li");
- $.each(tabtitle, function(i) {
- if ($(this).find("span").is(".able-close")) {
- tabDelete(option.elem, $(this).attr("lay-id"), option.closeEvent, option);
- }
- })
- layer.close(index);
- })
- }
-
- function toolEvent(option) {
- $("body .layui-tab[lay-filter='" + option.elem + "']").on("click", "#closeThis", function() {
- var currentTab = $(".layui-tab[lay-filter='" + option.elem +
- "'] .layui-tab-title .layui-this");
- if (currentTab.find("span").is(".able-close")) {
- var currentId = currentTab.attr("lay-id");
- tabDelete(option.elem, currentId, option.closeEvent, option);
- } else {
- layer.msg("当前页面不允许关闭", {
- icon: 3,
- time: 800
- })
- }
- })
-
- $("body .layui-tab[lay-filter='" + option.elem + "']").on("click", "#closeOther", function() {
- var currentId = $(".layui-tab[lay-filter='" + option.elem +
- "'] .layui-tab-title .layui-this").attr("lay-id");
- var tabtitle = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title li");
- $.each(tabtitle, function(i) {
- if ($(this).attr("lay-id") != currentId) {
- if ($(this).find("span").is(".able-close")) {
- tabDelete(option.elem, $(this).attr("lay-id"), option.closeEvent,
- option);
- }
- }
- })
- })
-
- $("body .layui-tab[lay-filter='" + option.elem + "']").on("click", "#closeAll", function() {
- var currentId = $(".layui-tab[lay-filter='" + option.elem +
- "'] .layui-tab-title .layui-this").attr("lay-id");
- var tabtitle = $(".layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title li");
- $.each(tabtitle, function(i) {
- if ($(this).find("span").is(".able-close")) {
- tabDelete(option.elem, $(this).attr("lay-id"), option.closeEvent, option);
- }
- })
- })
- }
-
- function mousewheelAndTouchmoveHandler(option) {
- var $bodyTab = $("body .layui-tab[lay-filter='" + option.elem + "'] .layui-tab-title")
- var $tabTitle = $('#' + option.elem + ' .layui-tab-title');
- var mouseScrollStep = 100
- // 鼠标滚轮
- $bodyTab.on("mousewheel DOMMouseScroll", function(e) {
- e.originalEvent.preventDefault()
- var delta = (e.originalEvent.wheelDelta && (e.originalEvent.wheelDelta > 0 ? "top" :
- "down")) || // chrome & ie
- (e.originalEvent.detail && (e.originalEvent.detail > 0 ? "down" : "top")); // firefox
- var scrollLeft = $tabTitle.scrollLeft();
-
- if (delta === "top") {
- scrollLeft -= mouseScrollStep
- } else if (delta === "down") {
- scrollLeft += mouseScrollStep
- }
- $tabTitle.scrollLeft(scrollLeft)
- });
-
- // 触摸移动
- var touchX = 0;
- $bodyTab.on("touchstart", function(e) {
- var touch = e.originalEvent.targetTouches[0];
- touchX = touch.pageX
- })
- $bodyTab.on("touchmove", function(e) {
- var event = e.originalEvent;
- if (event.targetTouches.length > 1) return;
- event.preventDefault();
- var touch = event.targetTouches[0];
- var distanceX = touchX - touch.pageX
- var scrollLeft = $tabTitle.scrollLeft();
- touchX = touch.pageX
- $tabTitle.scrollLeft(scrollLeft += distanceX)
- });
- }
-
- exports(MOD_NAME, new pearTab());
- })
|