我正在尝试禁用 jQuery UI 选项卡上的顶部菜单 - 因此选项卡将仅使用下一个/上一个按钮进行操作。
禁用选项,使文档无法按预期工作。
请在此处查看我的示例: Live Demo
jQuery 代码:
$(document).ready( function() {
$(function() {
var $tabs = $('#tabs').tabs();
$(".ui-tabs-panel").each(function(i){
var totalSize = $(".ui-tabs-panel").size() - 1;
if (i != totalSize) {
next = i + 2;
$(this).append("<a href='#' class='next-tab mover' rel='" + next + "'>Next Page »</a>");
}
if (i != 0) {
prev = i;
$(this).append("<a href='#' class='prev-tab mover' rel='" + prev + "'>« Prev Page</a>");
}
});
$('.next-tab, .prev-tab').click(function() {
$tabs.tabs('select', $(this).attr("rel"));
return false;
});
});
});
有什么想法可以禁用顶部菜单,但保留结构、样式等吗?
最佳答案
如何在选择选项卡之前启用选项卡,然后再次禁用选项卡?
因此,在初始化时,所有选项卡都被禁用:
var $tabs = $('#tabs').tabs({
disabled: [0, 1, 2]
});
选择选项卡时,在选择它之前启用它,然后再次禁用所有选项卡:
$tabs.tabs('enable', tabIndex)
.tabs('select', tabIndex)
.tabs("option","disabled", [0, 1, 2]);
查看实际效果:http://jsfiddle.net/william/y6QeV/21/ .
编辑:您只需禁用旧选项卡即可:
var newTabIndex = $(this).attr("rel");
var oldTabIndex = $tabs.tabs('option', 'selected');
$tabs.tabs('enable', newTabIndex)
.tabs('select', newTabIndex)
.tabs('disable', oldTabIndex);
关于jquery-ui - jQuery UI 选项卡 - 如何禁用顶部菜单?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7979063/