jquery ui tabs select似乎在1.10.3中不起作用

Question

The following program works in earlier releases of jQuery UI, but it does not work in the Latest release though. 以下程序适用于早期版本的jQuery UI，但它在最新版本中不起作用。

The select property does not call the function in the handleSelect variable. select属性不会调用handleSelect变量中的函数。 See the following fiddle: working tabs program 请参阅以下小提琴：工作标签程序

Here is my code for jQuery UI 1.10.3 这是我的jQuery UI 1.10.3的代码

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Tabs</title>
<link rel="stylesheet" href="css/smoothness/jquery-ui-1.10.2.custom.css">
<link rel="stylesheet" href="css/tabSelect.css">
</head>
<body>
<div id="myTabs">
    <ul>
        <li><a href="#a">Tab 1</a></li>
        <li><a href="#b">Tab 2</a></li>
    </ul>
    <div id="a">This is the content panel linked to the first tab, it is shown by default.</div>
    <div id="b">This is the content panel linked to the second tab, it is shown when its tab is clicked.</div>  
</div>
<script type="text/javascript" src="development-bundle/jquery-1.9.1.js"></script>

<script type="text/javascript" src="development-bundle/ui/jquery.ui.core.js"></script>

<script type="text/javascript" src="development-bundle/ui/jquery.ui.widget.js"></script>

<script type="text/javascript" src="development-bundle/ui/jquery.ui.tabs.js"></script>
<script type="text/javascript" src="development-bundle/ui/jquery.ui.effect.js"></script>
<script type="text/javascript" src="development-bundle/ui/jquery.ui.effect-blind.js"></script>
<script type="text/javascript">
    (function($) {
        var handleSelect = function(e, tab) {

            $("<p></p>", {
                text: "Tab at index " + tab.index + " selected",
                "class": "status-message ui-corner-all"
            }).appendTo(".ui-tabs-nav", "#myTabs").fadeOut(5000, function(){
                $(this).remove();
            });
        },
        tabOpts = {
            select : handleSelect
        };
        $("#myTabs").tabs({ select: handleSelect});
    })(jQuery);
</script>
</body>
</html>

Answer 1

See the upgrade guide for jQuery UI 1.10 请参阅jQuery UI 1.10的升级指南

Removed select event; 删除了select事件; use beforeActivate 使用beforeActivate

(#7154) The select event has been removed in favor of beforeActivate . （＃7154）已取消select事件以支持beforeActivate 。 See the 1.9 deprecation notice for full details. 有关完整详细信息，请参阅1.9弃用通知。

Here is a jsfiddle 这是一个jsfiddle

Replaced 更换

$("#myTabs").tabs({ select: handleSelect});

with 同

$("#myTabs").tabs({ beforeActivate: handleSelect});

EDIT 编辑

Just noticed that your indexes won't work with 1.10 either. 只是注意到你的索引也不适用于1.10。 Updated my fiddle! 更新了我的小提琴！ See the docu . 参见文件。

var handleSelect = function(e, tab) {

    $("<p></p>", {
        //this is new
        text: "Tab at index " + tab.newTab.index() + " selected",
        "class": "status-message ui-corner-all"
        }).appendTo(".ui-tabs-nav", "#myTabs").fadeOut(5000, function(){
            $(this).remove();
        });
}

jquery ui tabs select似乎在1.10.3中不起作用

问题描述

1 个解决方案

解决方案1
7 已采纳 2013-05-05 14:01:22

jquery ui tabs select似乎在1.10.3中不起作用

问题描述

1 个解决方案

解决方案1 7 已采纳 2013-05-05 14:01:22

解决方案1
7 已采纳 2013-05-05 14:01:22