jquery-ui-tabs

问题 I have jQuery UI tabs using AJAX. My problem is I can't seem to retrieve the url which was loaded inside a tab. For example - I get URL of loaded tab like this var links = $("#tabs > ul").find("li a"); var selectedTab = $("#tabs").tabs('option', 'selected'); var url = $.data(links[selectedTab], 'load.tabs'); Where url is the url of currently opened tab. In the tab I have an AJAX call, which calls the same url but with some parameters, i.e. $.ajax({ method: 'GET', url = url+'?parameter=value'

问题 I have code like this: var enTabs = { "Layout": 0, "Edit": 1, "Stuff": 2 } $("#tabs").tabs({ activate: function (event, ui) { switch (ui.newTab.index()) { case enTabs.Layout: // loads remote data, processes it, draws it to this tab; break; case enTabs.Edit: // loads remote data, processes it, draws it to this tab; break; case enTabs.Stuff: // loads remote data, processes it, draws it to this tab; break; } } }).tabs("option","disabled",[enTabs.Edit,enTabs.Stuff]); console.log("active tab", $("

问题 I am using Jquery ui tabs for my forms. Below is the skeleton of my code. <form id="1" method="post" class="main" action="myservlet"> <div id="tabs"> <ul> <li><a href="xyz/ABC.jsp">NewEmployee</a> </li> <li><a href="xyz/DEF.jsp">Add Leave</a> </li> </ul> </div> </forms> My problem is that I need to submit the details in both forms on one button click, I dont have forms inside both ABC and DEF jsp. I am carrying out validation of both jsp inside the each specific jsp itself. I referred to few

问题 load used to work with former versions of this library: $("#myTabs").tabs("load", index); According to the docs, this should load the remote tab. Yet once the tab has been loaded it doesn't load anymore. Also, disable the cache doesnt' work anymore: $( "#myTabs" ).tabs({ cache: false }); How may i emulate this former behaviour?, this breaks a lot of code in my app 回答1: The answer is in the changelog: http://jqueryui.com/upgrade-guide/1.9/#deprecated-ajaxoptions-and-cache-options-added

问题 Looking to allow user to nav through multiple Tabs on a page, but when hitting the back button, return to their previous page (not have to navigate back through their Tab history). It feels like one or the other with the method I'm using (either I change the URL and deal with the history, or I don't change the URL and don't deal with the history). I have looked into HTML History API, it doesn't seem to speak directly to this, nor do many of the posts I've found. I'd like my Tabs to be link

问题 I used ui-tabs ,this is the code iam used: <script type="text/javascript"> $(function () { $('#tabs').tabs({ event: '' }); }); function validateContact() { var fname = $('#first_name1').val(); if (fname == '') { alert("Enter Name"); } else { $('#tabs').tabs({ event: 'click' }); doitcontact(); } } function doitcontact() { var cnt = $("#frmdocontact").serialize(); $.ajax({ type: "POST", url: "doitcontact.php", data: cnt, success: function (msg) { var spt = msg.split('#$@$'); //alert(spt); $('

问题 Related question where I got the scripts: jQuery, multiple tab groups on one page jquery conflict with identical scripts So as the title says I have a page that contains multiple tab groups. the tabs only work on the first group and stops working on the rest. the script: $(function() { $(".tab_content").hide(); $("ul.tabs").each(function() { $(this).find('li:first').addClass("active"); $(this).next('.panes').find('.tab_content:first').show(); }); $("ul.tabs").each(function() { $("ul.tabs li a

问题 Since I upgraded to jQuery UI 1.10 something has changed. Before that upgrade, code related to my jQuery UI Tab was the following: $('.selector').tabs({ cache: true, ajaxOptions: { dataType: 'html' } }); As wrote in the jQuery UI 1.10 Upgrade Guide, both cache and ajaxOptions has been removed. The guide also states to use the beforeLoad event, but how can I upgrade the code as well? 回答1: A working approach is: $(".selector").tabs({ beforeLoad: function (event, ui) { if ( ui.tab.data( "loaded"

问题 Below is my HTML set up for the tabs which all works fine, i want to extend it a bit by changing the class of the outer containing div (id=tab-wrap class=bike) to whatever tab is showing. The idea is to change the background image based on the tab. <div id="tab-wrap" class="bike"> <div id="batter-finder"> <h1>Battery Finder</h1> <p>Choose Your Application then find your battery</p> <div id="tabs"> <ul> <li><a href="#bike">Bike</a></li> <li><a href="#atv">ATV</a></li> <li><a href="#utv">UTV</a

问题 I am using jQuery UI 1.9, and I've implemented the tabs widget pretty much as detailed on the demo page. PHP provides the data inside the tabs dynamically. <script> $(function() { $( "#tabs" ).tabs( { collapsible: true }); }); </script> <div id="tabs"> <ul> <li><a href="#holdings">Holdings</a></li> <li><a href="#personal">Personal</a></li> <li><a href="#account">Account</a></li> </ul> <div id="holdings"> blah blah blah </div> <div id="personal"> blah blah blah </div> <div id="account"> blah