Tag: jquery tabs

jQuery UI选项卡 – 锚定到内部链接

我在使用带有内部锚链接的jQuery UI(v1.11 +)选项卡时遇到了麻烦。 我的代码如下: 使用Javascript: $(document).ready(function () { $(“#tabs”).tabs(); }); HTML: Tab 1 Tab 2 Text for tab 1 Text for Tab 2 我无法尝试从位于页面不同区域的文本链接链接到这些选项卡。 目标是在单击指定选项卡的每个文本链接后平滑滚动: Link to Tab 1 Link to Tab 2 我在这里尝试了各种搜索,包括使用beforeActivate函数(因为所有“select”示例都是过时的jQuery UI版本),但没有什么对我有用。 有人可以帮忙吗? jQuery UI文档没有显示此示例。

带有标签的Google图表 – 图表区域不正确

虽然这似乎是一个常见的问题,但我无法找到解决这一特定问题的方法。 我正在尝试使用GOOGLE CHARTING API创建2个饼图。 第一个TAB(默认选中)中的第一个饼图显示了准确的宽度和高度,但隐藏选项卡中的第二个饼图没有显示适当的宽度。 这是小提琴 …… 在小提琴中,我们可以看到隐藏选项卡中的图表区域小于活动选项卡中的图表区域,尽管两个图表的代码相同… google.load(‘visualization’, ‘1.0’, {‘packages’:[‘corechart’]}); google.setOnLoadCallback(drawChart); function drawChart() { var data = google.visualization.arrayToDataTable([ [‘Task’, ‘Hours per Day’], [‘Work’, 11], [‘Eat’, 2], [‘Commute’, 2], [‘Watch TV’, 2], [‘Sleep’, 7] ]); var options = { title: ‘My Daily Activities’, backgroundColor: ‘#ddd’, chartArea: {width:500,height:200} }; var chart = new google.visualization.PieChart(document.getElementById(‘chart’)); chart.draw(data, options); […]

带有MVC4内容的jQuery选项卡

我正在尝试在jQuery选项卡中显示一些MVC4视图。 这是我的代码: App One App Two @{ Html.RenderPartial(“~/Views/AppOne/Index.cshtml”); } @{ Html.RenderPartial(“~/Views/AppTwo/Index.cshtml”); } 问题是第一个标签内容显示正常 – 但第二个是空的。 似乎部分视图没有呈现。 有没有办法强制jQuery选项卡在加载页面时更新所有选项卡的内容,或者强制部分视图在页面加载时呈现?

按日期触发jquery选项卡

我正在使用jquery选项卡来过滤一周内发生的一些事件。 http://jqueryui.com/tabs/ 所以我有标签 1st June 2013 2nd June 2013 3rd June 2013 Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Morbi tincidunt Mauris eleifend est et turpis. Duis cursus. 我希望例如tab-1在2013年6月1日打开,然后当6月2日到来时tab-2将成为页面加载时的活动选项卡。

单击选项卡上的jQuery加载页面只有一次

我有一个页面上有一些标签,点击某些标签后,其他页面会动态加载。 唯一的问题是每次单击选项卡时都会加载这些页面。 如何在第一次点击时只加载一次? 我使用的代码是这样的: $(document).ready(function(){ $(“.tab-content”).hide(); $(“#one”).show(); $(“a.tab-name”).click(function(){ $(“.tab-name-active”).removeClass(“tab-name-active”); $(this).addClass(“tab-name-active”); $(“.tab-content”).fadeOut(); var content_show=$(this).attr(“title”); if (content_show === ‘three’) { $(“#”+content_show).load(‘new-page.php’, function() { $(“#sorttable”).tablesorter({ headers: {0: {sorter: false}} }); }); } else if (content_show === ‘four’) { $(“#”+content_show).load(‘new-page-2.php’); } $(“#”+content_show).delay(100).fadeIn(‘slow’); return false; }); }); 谢谢!

jQuery选项卡 – 页面上有多个集合

这是我发布的上一个问题的后续内容,但我无法让它工作.. 我试图在一个页面上使用多组选项卡(jQuery)。 这是我用于一组选项卡的代码,它非常有用: $(‘div.tabs div.tab’).hide(); $(‘div.tabs div:first’).show(); $(‘div.tabs ul.htabs li:first a’).addClass(‘current’); $(‘div.tabs ul.htabs li a’).click(function(){ $(‘div.tabs ul.htabs li a’).removeClass(‘current’); $(this).addClass(‘current’); var currentTab = $(this).attr(‘href’); $(‘div.tabs div.tab’).hide(); $(currentTab).show(); return false; }); 要在页面上使用多个集合,我为每个标签集分配了#id,并尝试使用以下方法来实现: $.each([‘#tabs-1’, ‘#tabs-2’, ‘#tabs-3’ ], function(id) { $(id + ‘div.tab’).hide(); $(id + ‘div:first’).show(); $(id + ‘ul.htabs li:first a’).addClass(‘current’); $(id + ‘ul.htabs li a’).click(function(){ $(id + […]

如何使用jQuery默认预加载所有选项卡

如果我有4个选项卡,其中前2个加载ajax而后2个是静态的,我如何预先加载2个ajax选项卡? 目前,只有第一个标签会自动加载,第二个标签会在点击时加载。 我希望它们都被加载,以便当我点击第二个时,内容已经加载。 我尝试在第二个选项卡上调用load事件,如下所示: $(document).ready(function () { $(“#main-tabs”).tabs({ cache: true }); $(“#main-tabs”).tabs(“load”, 1); }); 这会加载第二个标签,但由于某些奇怪的原因,第一个标签根本没有加载; 即使我单击其他选项卡并单击第一个选项卡,它也不会加载。 然后我尝试了这样的事情: $(document).ready(function () { $(“#main-tabs”).tabs({ cache: true }); $(“#main-tabs”).tabs(“load”, 0); $(“#main-tabs”).tabs(“load”, 1); }); 同样的结果,加载第二个选项卡,第一个选项卡不加载。 如何自动加载所有这些(ajax)?

jQuery,一个页面上有多个选项卡组

我正在使用Soh Tanaka的一个很好的简单选项卡示例。 http://www.sohtanaka.com/web-design/simple-tabs-w-css-jquery 我试图在同一页面上放置多个选项卡组,但为每个选项卡组使用相同的类。 我正在动态制作选项卡的内容,因此为每个选项卡组创建新类是不可能的。 如何为不同的选项卡组使用相同的类,相同的jQuery? 我知道jQuery中有.each()方法,但我无法找到将它放在jQuery中的正确位置。 任何帮助是极大的赞赏。 提前致谢。

Microsoft JScript运行时错误:没有这样的方法’select’for tabs小部件实例

我需要在单击html按钮时为jquery选项卡选择特定的选项卡function。 我正在使用jquery.1.9.1.js和jquery-ui-1.10.2.custom.js文件。 我已经实现了以下代码,但对我不起作用。 $(“#ui-tabs”).tabs(); function SelectTab() { // bind click event to link $(‘#ui-tabs’).tabs(‘select’, 2); // switch to third tab return false; } Nunc tincidunt Proin dolor Aenean lacinia Tab1 content Tab2 content Tab3 content Select Tab 问题是声明$(‘#ui-tabs’).tabs(‘select’, 2); 在函数SelectTab给我错误Microsoft JScript runtime error: no such method ‘select’ for tabs widget instance 。 正常选择选项卡点击它们工作正常。 但是从函数调用完成时它不起作用。 在实施中出了什么问题或是否有任何文件丢失? […]

创建用于切换jQuery选项卡的Next按钮

如何创建一个滚动到下一个jQuery选项卡的按钮。 我想在选项卡中有一个下一个按钮,它将滚动到下一个选项卡,有点像一个分步教程。 如何才能做到这一点? 到目前为止,我的代码如下。 HTML One Two Three First tab is active by default: Next Tab Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh JS $(document).ready(function () { $(“#tabs”).tabs(); });