/** * segmented-controllers * @param {type} $ * @param {type} window * @param {type} document * @param {type} undefined * @returns {undefined} */ (function($, window, document, name, undefined) { var CLASS_CONTROL_ITEM = $.className('control-item'); var CLASS_SEGMENTED_CONTROL = $.className('segmented-control'); var CLASS_SEGMENTED_CONTROL_VERTICAL = $.className('segmented-control-vertical'); var CLASS_CONTROL_CONTENT = $.className('control-content'); var CLASS_TAB_BAR = $.className('bar-tab'); var CLASS_TAB_ITEM = $.className('tab-item'); var CLASS_SLIDER_ITEM = $.className('slider-item'); var handle = function(event, target) { if (target.classList && (target.classList.contains(CLASS_CONTROL_ITEM) || target.classList.contains(CLASS_TAB_ITEM))) { if (target.parentNode && target.parentNode.classList && target.parentNode.classList.contains(CLASS_SEGMENTED_CONTROL_VERTICAL)) { //vertical 如果preventDefault会导致无法滚动 } else { event.preventDefault(); //stop hash change } // if (target.hash) { return target; // } } return false; }; $.registerTarget({ name: name, index: 80, handle: handle, target: false }); window.addEventListener('tap', function(e) { var targetTab = $.targets.tab; if (!targetTab) { return; } var activeTab; var activeBodies; var targetBody; var className = $.className('active'); var classSelector = '.' + className; var segmentedControl = targetTab.parentNode; for (; segmentedControl && segmentedControl !== document; segmentedControl = segmentedControl.parentNode) { if (segmentedControl.classList.contains(CLASS_SEGMENTED_CONTROL)) { activeTab = segmentedControl.querySelector(classSelector + '.' + CLASS_CONTROL_ITEM); break; } else if (segmentedControl.classList.contains(CLASS_TAB_BAR)) { activeTab = segmentedControl.querySelector(classSelector + '.' + CLASS_TAB_ITEM); } } if (activeTab) { activeTab.classList.remove(className); } var isLastActive = targetTab === activeTab; if (targetTab) { targetTab.classList.add(className); } if (!targetTab.hash) { return; } targetBody = document.getElementById(targetTab.hash.replace('#', '')); if (!targetBody) { return; } if (!targetBody.classList.contains(CLASS_CONTROL_CONTENT)) { //tab bar popover targetTab.classList[isLastActive ? 'remove' : 'add'](className); return; } if (isLastActive) { //same return; } var parentNode = targetBody.parentNode; activeBodies = parentNode.querySelectorAll('.' + CLASS_CONTROL_CONTENT + classSelector); for (var i = 0; i < activeBodies.length; i++) { var activeBody = activeBodies[i]; activeBody.parentNode === parentNode && activeBody.classList.remove(className); } targetBody.classList.add(className); var contents = []; var _contents = parentNode.querySelectorAll('.' + CLASS_CONTROL_CONTENT); for (var i = 0; i < _contents.length; i++) { //查找直属子节点 _contents[i].parentNode === parentNode && (contents.push(_contents[i])); } $.trigger(targetBody, $.eventName('shown', name), { tabNumber: Array.prototype.indexOf.call(contents, targetBody) }); e.detail && e.detail.gesture.preventDefault(); //fixed hashchange }); })(mui, window, document, 'tab');