/ / डायनामिक रूप से सक्रिय टैब इंडेक्स jQuery यूआई टैब बदलें - jquery, jquery-ui, jquery-active -32

गतिशील बदलने सक्रिय टैब सूचकांक jquery ui टैब-jquery, jquery-ui, jquery-ui-टैब्स

मैं दो बटन का एक सेट बनाने की कोशिश कर रहा हूँjQuery Ui में सक्रिय टैब को बदल देगा। मैं जो करना चाहता हूं वह सक्रिय टैब इंडेक्स प्राप्त करता है, और फिर अगले टैब, या पिछले टैब पर जाएं, जिसके आधार पर बटन दबाया जाता है।

उदाहरण के लिए, यदि सक्रिय टैब संख्या 3 है, तो "MoveLeft" पर क्लिक करने से इसे 2 में बदल जाएगा। यदि "MoveRight" पर क्लिक किया जाता है, तो यह इसे 4 में बदल देगा। मुझे पता है कि यह निम्नलिखित की तरह कुछ है, लेकिन काफी नहीं:

var activeTab = $( ".tabs" ).tabs( "option", "active" );

$("#moveLeft").click(function() {
$(".tabs" ).tabs({ activeTab: -1 });
});
$("#moveRight").click(function() {
$(".tabs" ).tabs({ activeTab: +1 });
});

उत्तर:

जवाब के लिए 0 № 1

मैं समझता हूं कि आपको प्रचलित / अगले बटन जोड़ने की आवश्यकता है। मुझे चरणों के साथ एक प्रक्रिया की आवश्यकता थी। मैंने jquery UI टैब का उपयोग किया और यह मेरे लिए काम आया:

<script type="text/javascript">
$(document).ready(function() {
$("#ui-tabs").tabs();
function GetSelTabIndex() {
return $("#ui-tabs").tabs("option", "active");
}
function ShowTabs(stepN) {
var n = parseInt(stepN);
$("#ui-tabs").tabs("option", "active", parseInt(GetSelTabIndex()) + n);
}

$("#moveLeft, #moveRight").click(function () {
ShowTabs(this.value);
})
});
</script>

एचटीएमएल:

<button id="moveLeft" value="-1">Previous tab</button>
<button id="moveRight" value="1">Next tab</button>