gpt4 book ai didi

jQuery 交换元素

转载 作者:行者123 更新时间:2023-12-03 22:56:24 25 4
gpt4 key购买 nike

好吧,让我举个例子:

<head>
<script type="text/javascript">
$(document).ready(function(){

$("#options_2").hide();
$("#options_3").hide();

});
</script>
</head>
<body>
<div id="options_1">option 1</div>
<div id="options_2">option 2</div>
<div id="options_3">option 3</div>
<a href="" class="selected">choose option 1</a>
<a href="">choose option 2</a>
<a href="">choose option 3</a>
</body>

正如您所看到的,默认情况下只有选项 1 可见,并且您单击以显示选项 1 的链接默认情况下具有 class="selected",向用户显示该选项当前已被选中。我基本上想要它,以便当他们单击“选择选项 2”时,选项 1 div 隐藏自身,选项 2 div 显示自身,然后为第二个链接提供所选类并从图像链接中删除该类。

它基本上只是使用链接和 div 的选项卡,但由于我必须显示它的格式,我无法使用我在网上找到的任何选项卡插件。

最佳答案

首先为您的链接提供一个类或 ID(我使用过一个类),这将使交换变得更容易

<div id="options_1" class="tab" >option 1</div>
<div id="options_2" class="tab">option 2</div>
<div id="options_3" class="tab">option 3</div>

$(document).ready(function () {

var clickHandler = function (link) {
$('.tab').hide();
$('#option_' + link.data.id).show();
$('.selected').removeClass('selected');
$(this).attr('class','selected');
}

$('.link1').bind('click', {id:'1'} ,clickHandler);
$('.link2').bind('click', {id:'2'} ,clickHandler);
$('.link3').bind('click', {id:'3'} ,clickHandler);
})

关于jQuery 交换元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/233936/

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