【发布时间】:2019-10-12 17:07:07
【问题描述】:
我有 1 页
<a href="http://example.com/Rank1?page=tab-1">Rank1</a>
<a href="http://example.com/Rank2?page=tab-2">Rank2</a>
<a href="http://example.com/Rank3?page=tab-3">Rank3</a>
因此,当我单击链接时,我需要在新页面中的正确元素中添加“当前”类。 (我在新页面中有代码可以在工作正常的选项卡之间切换)。新页面中的表格:
<ul class="tabs">
<li id="divtab-1" class="button tab-link" data-tab="tab-1">Rank1</li>
<li id="divtab-2" class="button tab-link" data-tab="tab-2">Rank2</li>
<li id="divtab-3" class="button tab-link" data-tab="tab-3">Rank3</li>
</ul>
<div id="tab-1" class="tab-content">Rank1</div>
<div id="tab-2" class="tab-content">Rank2</div>
<div id="tab-3" class="tab-content">Rank3</div>
</div>
新页面中的实际代码 addclass 'current' o 在点击时删除 class 'current'。谢了!
jQuery( function( $ ){
$(document).ready(function(){
$('ul.tabs li').click(function(){
var tab_id = $(this).attr('data-tab');
$('ul.tabs li').removeClass('current');
$('.tab-content').removeClass('current');
$(this).addClass('current');
$("#"+tab_id).addClass('current');
})
})
var url = window.location.href;
var queryString = url.split("?")[1];
var paramValue = queryString.split("=")[1];
$("#div"+paramValue).addClass('current');
$("#"+paramValue).addClass('current');
});
【问题讨论】:
-
我怀疑你想错了。从一个页面导航到另一个页面时,第一页不会修改第二页上的任何内容。每个页面都是独立运行的。专注于您的第二页。当该页面加载时,您需要检测哪些信息才能确定要执行的操作? 听起来您希望在页面加载时读取 URL,并根据该 URL 修改某些元素的类。
-
我编辑了这篇文章。我认为你是对的。我想在第 1 页链接 Rank2 中单击(链接到第 2 页),然后在第 2 页中添加“li.button.tab-link”选项卡 2 和“选项卡内容”选项卡 2 中的“当前”以显示信息。
-
第一个链接与标签之间的关系是什么?如果您点击
http://example.com/Rank2/
,您需要将current
添加到所有tab-2
中吗?那为什么.tab-link
不是锚? -
好吧,实际上我使用的代码关注“data-tab”和#tab_id。它工作正常,但我不知道如何编辑以使用 url 参数或类似的东西。
标签: javascript jquery