gpt4 book ai didi

javascript - 在链接选择上使用 jQuery 添加/删除类

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

我正在尝试在 jQuery 中编写一个函数,它将向选定的链接添加一个类(在 iframe 中打开一个页面),然后在选择另一个链接时删除该类。我之前从这里的另一位成员那里得到了一些类似的帮助,但涉及单选按钮和表格。

我尝试使用它一段时间,但 jQuery 对我来说仍然很新,所以我对它了解不多。

基本上,<div id="CollapsiblePanelContent"> ... </div> 中包含大约 3-4 组链接。我想向 <a> 添加样式用户选择的此容器内的标记。

任何帮助将不胜感激。谢谢。

<div id="CollapsiblePanelContent">  
<a href="page1.asp" onclick="return handlelink(this)">Link1</a>
<a href="page2.asp" onclick="return handlelink(this)">Link2</a>
<a href="page3.asp" onclick="return handlelink(this)">Link3</a>
<a href="page4.asp" onclick="return handlelink(this)">Link4</a>
</div>

<script type='text/javascript'>
$(function() {
$('div').click(function(event) {
$(this).closest('.CollapsiblePanelContent').addClass('selected').parent().siblings().each(function() {
$(this).find('.CollapsiblePanelContent').removeClass('selected');
});
});
});
</script>

最佳答案

$('#CollapsiblePanelContent a').on('click', function(e){
e.preventDefault(); // prevent page reload, you may remove it if don't need
$(this).addClass('selected').siblings().removeClass('selected');
});

由于 CollapsiblePanelContentid,因此正确的选择器将是 #CollapsiblePanelContent 而不是 .CollapsiblePanelContent

但是,如果您对多个 div 使用 CollapsiblePanelContent ,那么它应该是带选择器的 class 而不是 id .CollapsiblePanelContent。因为多个元素可以具有相同的 id

关于javascript - 在链接选择上使用 jQuery 添加/删除类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11376986/

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