gpt4 book ai didi

jquery - 无法使用 jQuery 在 HTML 中的选项卡上捕获点击事件

转载 作者:行者123 更新时间:2023-11-28 01:23:19 25 4
gpt4 key购买 nike

我知道这是一个非常基本的问题,我已经有了构建相同逻辑的逻辑,但我无法在选项卡上捕获 click 事件。这是 JSfiddle对于相同的这是我的代码

    <html lang="en">
<head>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> </link>

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<script>
$(document).ready(function() {
$('#tabs, #tabs-1').tabs({
select: function(event, ui){
var tabNumber = ui.index;
var tabName = $(ui.tab).text();

alert('Tab number ' + tabNumber + ' - ' + tabName + ' - clicked');
}
});
});
</script>
</head>
<body>
<input type="text" id="text_box_id" ></input>
<div id="tabs">
<ul>
<li><a href="#tabs-1">Nunc tincidunt</a></li>
<li><a href="#tabs-2">Proin dolor</a></li>
<li><a href="#tabs-3">Aenean lacinia</a></li>
</ul>
<div id="tabs-1">
<p> text in tab1</p>
</div>
<div id="tabs-2">
<p>Text in tab2</p>
</div>
<div id="tabs-3">
<p>Text in tab3 </p>
</div>
</div>
</body>
</html>

我是不是做错了什么?我是否正确导入了库?

最佳答案

Select 已弃用,使用 activate 代替 select。

http://bugs.jqueryui.com/ticket/7138

In order to improve consistency within the jQuery UI suite, select/selected will be renamed to activate/active across the board. What this means for tabs is that the selected option will be renamed to active, the select event will be renamed to beforeactivate, and the show event will be renamed to activate. The beforeactivate and activate options will include references to the tab and content panel for the old and new tabs, similar to accordion. In addition, the select method will be removed in favor of the setting the active option. Lastly, the deselectable option will be removed in 1.9 since it was deprecated in 1.8.

使用激活

 $('#tabs, #tabs-1').tabs({
activate: function(event, ui){
var tabNumber = ui.newTab.index(); // get index
var tabName = ui.newTab.text(); // get name
alert('Tab number ' + tabNumber + ' - ' + tabName + ' - clicked');
}
});

JsFiddle:

https://jsfiddle.net/18418exe/27/

关于jquery - 无法使用 jQuery 在 HTML 中的选项卡上捕获点击事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33080621/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com