jQuery ui.index is always undefined_问答_开发者

开发者 https://www.devze.com 2023-02-04 12:12 出处：网络

I have a problem when i try to remember the last clicked tab in jQuery. I want to use ui.index in the javascript code, but i开发者_如何学编程 found it always get undefined.

Here is my code:

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

Does anyone know how to solve it? Thanks

Edit:

Here is my html code:

<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>

I use a hiddenField to remember the tab i choosed.

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

My javascript code modified:

$(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);
});

This line always return 0.

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

I'm really confused. :(

if you want to remember last selected tab after browser close you should use cookie. if you want to remember selected tab without browser closing this COMPLETE code working for me:(if you want to use hidden input)

<!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>

after browser "alert 2" after select 1th tabs "alert 0" two times

use cookie . check this link

function is like:

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

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

I got a problem with

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

and replace with

$("#hiddenSelectedTab").val()

and it works!

jQuery ui.index is always undefined

精彩评论

关注公众号

热门标签

图文推荐

jQuery ui.index is always undefined

更多 问答 相关资讯：

精彩评论

关注公众号

热门标签

图文推荐

更多问答相关资讯：