Question

当我尝试记住jQuery中最后一次单击的选项卡时，我遇到了问题。我想在javascript代码中使用ui.index，但我发现它总是未定义。

这是我的代码：

$('#tabs').bind('tabsselect', function(event, ui) {
  var newIndex = ui.index;
  $("#<%=hiddenSelectedTab.ClientID%>").val(newIndex);
});

有谁知道如何解决它？感谢

修改

这是我的HTML代码：

<div id="tabs">
    <ul>
       <li><a href="#link1">
             link1</a></li>
       <li><a href="#link2">
             link2</a></li>
       <li><a href="#link3">
             link3</a></li>
    </ul>
    <div id="link1"></div>
    <div id="link2"></div>
    <div id="link3"></div>
</div>

我使用hiddenField来记住我选择的标签。

<input type="hidden" id="hiddenSelectedTab" runat="server" value="0" />

我修改了javascript代码：

$(document).ready(function() {
            $("#tabs").tabs().tabs('select', parseInt($("#<%=hiddenSelectedTab.ClientID%>").val()));
            var $tabs = $("#tabs").tabs();
            var selected = $tabs.tabs("option", "selected");
            $("#<%=hiddenSelectedTab.ClientID%>").val(selected);
});

此行始终返回0.

var selected = $tabs.tabs("option", "selected");

我真的很困惑。：（

Answer 1

如果您想在浏览器关闭后记住上次选择的选项卡，则应使用cookie。如果你想记住所选的标签而没有浏览器关闭这个COMPLETE代码为我工作:(如果你想使用隐藏的输入）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd">
<html>
<head>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script src="js/jquery.ui.core.js"></script> 
<script src="js/jquery.ui.widget.js"></script> 
<script src="js/jquery.ui.tabs.js"></script>
<link rel="stylesheet" href="css/jquery-ui-1.8.7.custom.css"/> 
</head>
<div id="tabs">
    <ul>
       <li><a href="#link1">
             link1</a></li>
       <li><a href="#link2">
             link2</a></li>
       <li><a href="#link3">
             link3</a></li>
    </ul>
    <div id="link1"></div>
    <div id="link2"></div>
    <div id="link3"></div>
</div>
<input type="hidden" id="hiddenSelectedTab"  value="2" />
<script language="javascript">
$(document).ready(function() {
alert($("#hiddenSelectedTab").val());
$("#tabs").tabs().tabs({
selected:parseInt($("#hiddenSelectedTab").val()),
select: function(event, ui) { 
alert(ui.index);
$("#hiddenSelectedTab").val(ui.index);
alert($("#hiddenSelectedTab").val());
}
});
});
</script>

在浏览器“警报2”之后选择第1个标签“警报0”两次

Answer 2

使用cookie。检查this link

功能就像：

$(function() {
    $( "#tabs" ).tabs({
        cookie: {
            // store cookie for a day, without, it would be a session cookie
            expires: 1
        }
    });
})

Answer 3

$("#tabs").tabs().tabs('select',$("#hiddenSelectedTab").val());
var $tabs = $("#tabs").tabs();
var selected = $tabs.tabs("option", "selected");
$("#<%=hiddenSelectedTab.ClientID%>").val("selected");

我遇到了

的问题

parseInt($("#<%=hiddenSelectedTab.ClientID%>").val())

并替换为

$("#hiddenSelectedTab").val()

它有效！

jQuery ui.index总是未定义的

3 个答案: