|
本館粉絲專頁 |
|
|
MediaWiki:Common.js:修訂版本之間的差異
台灣棒球維基館
第6行: | 第6行: | ||
− | /** | + | /* 1. 功能設定 */ |
− | + | window.JSConfig = window.JSconfig || {}; | |
− | + | window.JSConfig.collapseText = wgULS('隐藏▲', '隱藏▲'); // 指示折叠收缩的默认文字 | |
− | + | window.JSConfig.expandText = wgULS('显示▼', '顯示▼'); // 指示折叠展开的默认文字 | |
− | + | window.JSConfig.autoCollapse = 2; // 文章少于 autoCollapse 个折叠块时,不自动折叠 | |
− | + | //window.JSConfig.SpecialSearchEnhancedDisabled=false; // 是否禁止增加其它搜索引擎 | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | /* | + | /* 2. 用jQuery实现的getElementsByClassName(需不需要返回DOM对象?) */ |
− | + | window.getElementsByClassName = function (elm, tag, className) { | |
+ | return $(tag + '.' + className, elm); | ||
+ | }; | ||
− | + | /* 3. 遍历 */ | |
− | + | window.applyEach = function (callback, array) { | |
+ | var i = 0, | ||
+ | j = array.length; | ||
+ | while (i < j) { | ||
+ | callback(array[i++]); | ||
+ | } | ||
+ | }; | ||
− | /* | + | /* 4. 移動元素 */ |
− | + | window.elementMoveto = function (node, refNode, pos) { // 默认位置为refNode前 | |
− | + | if (node && refNode) { | |
− | + | if (pos && pos == 'after') { | |
− | + | $(refNode).after(node); | |
− | + | } else { | |
− | + | $(refNode).before(node); | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | / | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | if ( | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | } | |
− | } | + | }; |
− | /* | + | /* 5. 创建元素 */ |
− | + | window.createElement = function (tag, children, props) { | |
− | + | var element = document.createElement(tag); | |
− | + | if (!(children instanceof Array)) { | |
− | + | children = [children]; | |
− | + | } | |
− | + | applyEach(function (child) { | |
− | + | if (typeof child == 'string') { | |
− | + | child = document.createTextNode(child); | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | if ( | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | if ( | + | if (child) { |
− | + | element.appendChild(child); | |
} | } | ||
− | + | }, children); | |
− | + | if (typeof props == 'object') { | |
− | + | for (var k in props) { | |
− | + | switch (k) { | |
− | + | case 'styles': | |
− | + | var styles = props.styles; | |
− | + | for (var s in styles) { | |
− | + | element.style[s] = styles[s]; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | var | + | break; |
− | + | case 'events': | |
− | + | var events = props.events; | |
+ | for (var e in events) { | ||
+ | addHandler(element, e, events[e]); | ||
} | } | ||
− | + | break; | |
− | + | case 'class': | |
− | + | element.className = props[k]; | |
− | + | break; | |
− | + | default: | |
− | + | element.setAttribute(k, props[k]); | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | } | + | } |
+ | return element; | ||
+ | }; | ||
− | + | /* 测试元素中是否含有指定的样式 */ | |
− | + | window.hasClass = function (elem, cls) { | |
− | + | return $(elem).hasClass(cls); | |
− | + | }; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | } | + | |
− | + | ||
− | + | /** 增加摺疊功能 | |
− | + | * | |
− | /** | + | * 实现div.NavFrame和table.collapsible的可折叠性。 |
− | + | * JSConfig的collapseText、expandText、autoCollapse属性定义默认文字和默认最少自动折叠块 | |
− | + | * Maintainers: User:fdcn | |
− | + | */ | |
− | + | function cancelBubble(e) { | |
− | + | e = e || window.event; | |
− | + | if (e.stopPropagation) { | |
− | + | e.stopPropagation(); | |
− | + | } else { | |
− | + | e.cancelBubble = true; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | function createToggleButton(head) { | |
− | + | var parent = head; | |
− | + | if (head.tagName.toLowerCase() == 'tr') { // 对表格特别处理 | |
− | + | if (head.getElementsByTagName("th").length) { | |
− | + | parent = head.cells[parent.cells.length - 1]; | |
− | + | } else { | |
+ | return; | ||
} | } | ||
− | + | } | |
− | + | var textS, textH, button = getElementsByClassName(head, "span", "NavToggle")[0]; | |
− | + | if (button) { | |
− | + | parent = button.parentNode; | |
− | + | } else { | |
− | + | textS = createElement("span", [JSConfig.expandText], { | |
− | + | 'class': 'toggleShow' | |
− | + | }); | |
− | + | textH = createElement("span", [JSConfig.collapseText], { | |
− | + | 'class': 'toggleHide' | |
+ | }); | ||
+ | button = createElement("span", [textS, textH], { | ||
+ | 'class': 'NavToggle collapseButton' | ||
+ | }); | ||
+ | } | ||
+ | button.style.visibility = "visible"; | ||
+ | head.className += " uncollapse toggleHotspot"; | ||
+ | parent.insertBefore(button, parent.childNodes[0]); | ||
} | } | ||
− | + | window.wgCollapse = function (head, container, defaultCollapse) { | |
− | + | if (head) { | |
− | + | createToggleButton(head); | |
− | + | } | |
− | + | var self = this; | |
− | + | this.state = 0; | |
− | + | this.container = container; | |
− | + | applyEach(function (h) { | |
− | + | if (h.nodeType == 1 && !hasClass(h, "uncollapse") && !hasClass(h, "toggleShow") && !hasClass(h, "toggleHide")) { | |
− | + | h.className += " toggleHide"; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | }, defaultCollapse); // 预设的隐藏元素 | |
− | + | ||
− | |||
− | + | function getArray(clsname) { | |
− | + | var r = [], | |
− | + | i = 0, | |
− | + | e, ea = getElementsByClassName(container, "*", clsname); | |
− | + | while (e = ea[i++]) { | |
− | + | var parent = e.parentNode; | |
− | function | + | while (!hasClass(parent, 'NavFrame') && !hasClass(parent, 'collapsible')) { |
− | + | parent = parent.parentNode; | |
− | + | } | |
− | + | if (parent == container) { | |
− | + | r.push(e); | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | return r; | |
− | } | + | } |
+ | var toggleA = getArray("toggleShow"); | ||
+ | var toggleB = getArray("toggleHide"); | ||
+ | var hotspots = getArray("toggleHotspot"); | ||
− | + | function _toggle(list, state) { | |
− | + | var i = 0, | |
− | + | e; | |
− | + | while (e = list[i++]) { | |
− | + | e.style.display = state ? e.showStyle || '' : 'none'; | |
− | + | ||
− | + | ||
− | + | ||
− | function | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | } | |
+ | this.toggle = function (state) { | ||
+ | self.state = (typeof state == 'undefined') ? 1 - self.state : state; | ||
+ | _toggle(toggleA, self.state); | ||
+ | _toggle(toggleB, 1 - self.state); | ||
+ | } | ||
+ | var i = 0, | ||
+ | h; | ||
+ | while (h = hotspots[i++]) { | ||
+ | applyEach(function (link) { | ||
+ | addClickHandler(link, cancelBubble); | ||
+ | }, h.getElementsByTagName("A")); | ||
+ | h.style.cursor = "pointer"; | ||
+ | $(h).attr('tabindex', '0').keydown(function (event) { | ||
+ | if (event.which == 13) { // Enter | ||
+ | self.toggle(); | ||
+ | } | ||
+ | }); | ||
+ | addClickHandler(h, function () { | ||
+ | self.toggle(); | ||
+ | }); | ||
+ | } | ||
+ | }; | ||
− | $( function () { | + | $(function () { |
− | var | + | if (!window.disableCollapse) { |
− | + | // init | |
− | + | var items = []; | |
+ | applyEach(function (NavFrame) { | ||
+ | var i = 0, | ||
+ | child = NavFrame.childNodes, | ||
+ | head; | ||
+ | while (head = child[i++]) { | ||
+ | if (head.className && hasClass(head, "NavHead")) { | ||
+ | break; | ||
+ | } | ||
+ | } | ||
+ | items.push(new wgCollapse(head, NavFrame, NavFrame.childNodes)); | ||
+ | }, getElementsByClassName(document, "div", "NavFrame")); | ||
+ | applyEach(function (table) { | ||
+ | var rows = table.rows; | ||
+ | items.push(new wgCollapse(rows[0], table, rows)); | ||
+ | }, getElementsByClassName(document, "table", "collapsible")); | ||
+ | var item, i = 0, | ||
+ | count = items.length; | ||
+ | while (item = items[i++]) { | ||
+ | item.toggle( | ||
+ | hasClass(item.container, "collapsed") || (count >= JSConfig.autoCollapse && hasClass(item.container, "autocollapse"))); | ||
} | } | ||
− | + | } | |
− | + | }); | |
− | + | ||
− | } ); | + | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + |
2015年10月9日 (五) 22:02的修訂版本
/* 此處的JavaScript將載入於所有用戶每一個頁面。 */ mw.loader.load( 'jquery.ui.button' ); function my_accordion() { jQuery( "#button" ).accordion({ collapsible: true, active: false }); } jQuery( my_button); /* 1. 功能設定 */ window.JSConfig = window.JSconfig || {}; window.JSConfig.collapseText = wgULS('隐藏▲', '隱藏▲'); // 指示折叠收缩的默认文字 window.JSConfig.expandText = wgULS('显示▼', '顯示▼'); // 指示折叠展开的默认文字 window.JSConfig.autoCollapse = 2; // 文章少于 autoCollapse 个折叠块时,不自动折叠 //window.JSConfig.SpecialSearchEnhancedDisabled=false; // 是否禁止增加其它搜索引擎 /* 2. 用jQuery实现的getElementsByClassName(需不需要返回DOM对象?) */ window.getElementsByClassName = function (elm, tag, className) { return $(tag + '.' + className, elm); }; /* 3. 遍历 */ window.applyEach = function (callback, array) { var i = 0, j = array.length; while (i < j) { callback(array[i++]); } }; /* 4. 移動元素 */ window.elementMoveto = function (node, refNode, pos) { // 默认位置为refNode前 if (node && refNode) { if (pos && pos == 'after') { $(refNode).after(node); } else { $(refNode).before(node); } } }; /* 5. 创建元素 */ window.createElement = function (tag, children, props) { var element = document.createElement(tag); if (!(children instanceof Array)) { children = [children]; } applyEach(function (child) { if (typeof child == 'string') { child = document.createTextNode(child); } if (child) { element.appendChild(child); } }, children); if (typeof props == 'object') { for (var k in props) { switch (k) { case 'styles': var styles = props.styles; for (var s in styles) { element.style[s] = styles[s]; } break; case 'events': var events = props.events; for (var e in events) { addHandler(element, e, events[e]); } break; case 'class': element.className = props[k]; break; default: element.setAttribute(k, props[k]); } } } return element; }; /* 测试元素中是否含有指定的样式 */ window.hasClass = function (elem, cls) { return $(elem).hasClass(cls); }; /** 增加摺疊功能 * * 实现div.NavFrame和table.collapsible的可折叠性。 * JSConfig的collapseText、expandText、autoCollapse属性定义默认文字和默认最少自动折叠块 * Maintainers: User:fdcn */ function cancelBubble(e) { e = e || window.event; if (e.stopPropagation) { e.stopPropagation(); } else { e.cancelBubble = true; } } function createToggleButton(head) { var parent = head; if (head.tagName.toLowerCase() == 'tr') { // 对表格特别处理 if (head.getElementsByTagName("th").length) { parent = head.cells[parent.cells.length - 1]; } else { return; } } var textS, textH, button = getElementsByClassName(head, "span", "NavToggle")[0]; if (button) { parent = button.parentNode; } else { textS = createElement("span", [JSConfig.expandText], { 'class': 'toggleShow' }); textH = createElement("span", [JSConfig.collapseText], { 'class': 'toggleHide' }); button = createElement("span", [textS, textH], { 'class': 'NavToggle collapseButton' }); } button.style.visibility = "visible"; head.className += " uncollapse toggleHotspot"; parent.insertBefore(button, parent.childNodes[0]); } window.wgCollapse = function (head, container, defaultCollapse) { if (head) { createToggleButton(head); } var self = this; this.state = 0; this.container = container; applyEach(function (h) { if (h.nodeType == 1 && !hasClass(h, "uncollapse") && !hasClass(h, "toggleShow") && !hasClass(h, "toggleHide")) { h.className += " toggleHide"; } }, defaultCollapse); // 预设的隐藏元素 function getArray(clsname) { var r = [], i = 0, e, ea = getElementsByClassName(container, "*", clsname); while (e = ea[i++]) { var parent = e.parentNode; while (!hasClass(parent, 'NavFrame') && !hasClass(parent, 'collapsible')) { parent = parent.parentNode; } if (parent == container) { r.push(e); } } return r; } var toggleA = getArray("toggleShow"); var toggleB = getArray("toggleHide"); var hotspots = getArray("toggleHotspot"); function _toggle(list, state) { var i = 0, e; while (e = list[i++]) { e.style.display = state ? e.showStyle || '' : 'none'; } } this.toggle = function (state) { self.state = (typeof state == 'undefined') ? 1 - self.state : state; _toggle(toggleA, self.state); _toggle(toggleB, 1 - self.state); } var i = 0, h; while (h = hotspots[i++]) { applyEach(function (link) { addClickHandler(link, cancelBubble); }, h.getElementsByTagName("A")); h.style.cursor = "pointer"; $(h).attr('tabindex', '0').keydown(function (event) { if (event.which == 13) { // Enter self.toggle(); } }); addClickHandler(h, function () { self.toggle(); }); } }; $(function () { if (!window.disableCollapse) { // init var items = []; applyEach(function (NavFrame) { var i = 0, child = NavFrame.childNodes, head; while (head = child[i++]) { if (head.className && hasClass(head, "NavHead")) { break; } } items.push(new wgCollapse(head, NavFrame, NavFrame.childNodes)); }, getElementsByClassName(document, "div", "NavFrame")); applyEach(function (table) { var rows = table.rows; items.push(new wgCollapse(rows[0], table, rows)); }, getElementsByClassName(document, "table", "collapsible")); var item, i = 0, count = items.length; while (item = items[i++]) { item.toggle( hasClass(item.container, "collapsed") || (count >= JSConfig.autoCollapse && hasClass(item.container, "autocollapse"))); } } });