blocks|key|113678|text|您可以始终使用导航栏上的on+click函数将所需选项卡的类设置为“活动”。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|113679|$("navelement").on("click",+function(){
++++$("#tab_id").addClass("active");
}|code-block|syntax|javascript|113680|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>You could always use an on click function on your navigation bar to set the class of the required tab to "active"</p>

<pre><code>$("navelement").on("click", function(){
    $("#tab_id").addClass("active");
}
</code></pre>


blocks|key|2285706|text|从选项卡中移除活动类|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2285707|$("#tab1").removeClass("active");|code-block|syntax|javascript|2285708|将类添加到新选项卡|2285709|$("#tab2").addClass("active");|2285710|隐藏第一个面板|2285711|$("#panel1").hide();|2285712|显示新面板|2285713|$("#panel2").show();|2285714|entityMap^0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|W|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|X|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|Y|8|@]|9|@]|A|$]]|$1|M|3|N|5|D|7|Z|8|@]|9|@]|A|$E|F]]|$1|O|3|P|5|6|7|10|8|@]|9|@]|A|$]]|$1|Q|3|R|5|D|7|11|8|@]|9|@]|A|$E|F]]|$1|S|3|-4|5|6|7|12|8|@]|9|@]|A|$]]]|T|$]]

<p>Remove the active class from the tab</p>

<pre><code>$("#tab1").removeClass("active");
</code></pre>

<p>Add the class to the new tab</p>

<pre><code>$("#tab2").addClass("active");
</code></pre>

<p>Hide the first panel</p>

<pre><code>$("#panel1").hide();
</code></pre>

<p>Show new panel</p>

<pre><code>$("#panel2").show();
</code></pre>


blocks|key|2285816|text|编辑1：我有时间研究基金会是如何工作的。这样我就能找到一个更有教养的解决方案。我最初的想法是模仿在css级别上点击项目的效果。|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|2285817|这并不意味着旧的解决方案行不通。事实上，这两种解决方案的最终结果是相同的。我已经测试了旧的和新的解决方案的一个副本的HTML你的网站。|2285818|还借此机会补充了一些澄清。|2285819|编辑2：我增加了对broser历史的控制。这意味着代码将更改用户看到的url，并将正确处理tha按钮，所有这些都不需要重新加载页面。|2285820|路线图|2285821|你必须这样做：|2285822|添加一个id来处理选项卡。|ordered-list-item|2285823|创建一个JavaScript函数selectTab来在它们之间切换。取决于您选择的解决方案。|CODE|2285824|创建一个JavaScript函数navigateTab，它将调用selectTab，但也更新浏览器历史记录。|2285825|添加单击事件处理程序。|2285826|处理后按钮。|2285827|那么，让我们先得到共同的部分：|2285828|添加一个id来处理选项卡|2285829|HTML：|2285830|<dl+id="LOOK_MY_ID"+class="tabs"+data-tab>
++++<dd+class="active"><a+href="#panel2-1">Tab+1</a></dd>
++++<dd><a+href="#panel2-2">Tab+2</a></dd>
++++<dd><a+href="#panel2-3">Tab+3</a></dd>
++++<dd><a+href="#panel2-4">Tab+4</a></dd>
</dl>
<div+class="tabs-content">
++++<div+class="content+active"+id="panel2-1">
++++++++<p>First+panel+content+goes+here...</p>
++++</div>
++++<div+class="content"+id="panel2-2">
++++++++<p>Second+panel+content+goes+here...</p>
++++</div>
++++<div+class="content"+id="panel2-3">
++++++++<p>Third+panel+content+goes+here...</p>
++++</div>
++++<div+class="content"+id="panel2-4">
++++++++<p>Fourth+panel+content+goes+here...</p>
++++</div>
</div>|code-block|syntax|javascript|2285831|注意:这是基于基础Tabs示例中显示的HTML。在您的代码中，您将向具有类corporation-frame的div添加id。|2285832|创建助手函数|2285833|helper函数的目的是使click事件处理程序更容易，同时抽象代码以更改浏览器url。如下所示，我们绕着这条路走。|2285834|JavaScript：|2285835|function+navigateTab(event)
{
++++var+url+=+$(event.target).attr('href');
++++var+target+=+url.split('#')[1];
++++if+(target.substr(0,+3)+==+'tab')
++++{
++++++++var+state+=+{tab:+target.substr(3)};
++++++++selectTab("LOOK_MY_ID",+state.tab);+//<--+change+the+tab
++++++++history.pushState(state,+null,+url);+//<--+change+the+url
++++++++event.preventDefault();
++++}
}|2285836|正如您所看到的，它使用event，原因是我们将直接使用这个函数作为单击事件处理程序。另外，要选择的选项卡和要放置的url都来自单击的超链接的href属性。|2285837|此技术还允许安全地同时将单击事件处理程序添加到所有链接中。|2285838|注意:我们正在通过使用HTML5+5的历史API来更改url。|2285839|添加事件处理程序|2285840|您需要在链接中添加一个事件处理程序(Foundation将这些添加到幕后的选项卡中，我们将对您的菜单进行模拟)。|2285841|有两种方法可以添加这些事件处理程序..。|2285842|方法A)|2285843|选择锚并通过JavaScript添加事件处理程序：|2285844|$('ul.dropdown+a').on("click",+navigateTab);|2285845|再简单不过了。|2285846|注意:确保使用正确的选择器从菜单中选择超链接。此外，您可能需要(如果您将脚本添加到页面顶部)来使用ready添加以下内容：|2285847|$(document).ready(
++++function()
++++{
++++++++$('ul.dropdown+a').on("click",+navigateTab);
++++}
);|2285848|方法B)|2285849|将事件处理程序直接添加到HTML上：|2285850|2285851|<a+href="#tab3"+onclick="navigateTab(event)">Tab+3</a>|2285852|注1:如果处理程序上禁用了JavaScript，它将使页面跳转到内容(如果它们是可见的)。这是没有JavaScript你能得到的最好的结果。|2285853|处理后按钮|2285854|在前面的代码中，我们不仅要更改浏览器中的url，而且还要在页面的导航历史记录中添加一个条目.那么，当用户单击“后退”时会发生什么呢？好的，我们将再次使用HTML5+5的历史API来处理后退按钮。|2285855|为了处理这个问题，我们将添加以下代码：|2285856|window.onpopstate+=+function(event)
{
++++selectTab("LOOK_MY_ID",+event.state.tab);+//<--+change+the+tab
};|2285857|这就是为什么我们不应该从selectTab中更改url，因为如果我们这样做..。我们将无法向后航行！|2285858|注意:这段代码不仅负责“后退”按钮，还负责页面内浏览器历史记录中的任何导航。|2285859|新解|2285860|创建一个JavaScript函数以在它们之间切换|2285861|函数selectTab将通过以下方式实现：|2285862|模仿基金会的工作(基于基金会的实际代码)：|2285863|2285864|function+selectTab(id,+tab)
{
++++//+activate+only+the+right+tab:
++++var+tab+=+$("#"+%2B+id+%2B+"+>+dl+>+dd:nth-child("+%2B+tab+%2B+")");
++++var+a+=+$("a",+tab);
++++target+=+$('#'+%2B+a.attr("href").split('#')[1]);
++++siblings+=+tab.siblings();
++++settings+=+tab.closest('[data-tab]').data('tab-init');

++++tab.addClass(settings.active_class);
++++siblings.removeClass(settings.active_class);
++++target.siblings().removeClass(settings.active_class).end().addClass(settings.active_class);
}|2285865|旧溶液|2285866|2285867|2285868|使选项卡处于活动状态|2285869|激活相应的内容|2285870|使所有其他选项卡不活动|2285871|使所有其他内容不活动|2285872|2285873|function+selectTab(id,+tab)
{
++++//+activate+only+the+right+tab:
++++$("#"+%2B+id+%2B+"+>+dl").children().each
++++(
++++++++function(index,+element)
++++++++{
++++++++++++if+(index+==+tab)
++++++++++++{
++++++++++++++++$(element).addClass("active");
++++++++++++}
++++++++++++else
++++++++++++{
++++++++++++++++$(element).removeClass("active");
++++++++++++}
++++++++}
++++);
++++//+activate+only+the+right+content:
++++$("#"+%2B+id+%2B+"+>+div").children().each
++++(
++++++++function(index,+element)
++++++++{
++++++++++++if+(index+==+tab)
++++++++++++{
++++++++++++++++$(element).addClass("active");
++++++++++++}
++++++++++++else
++++++++++++{
++++++++++++++++$(element).removeClass("active");
++++++++++++}
++++++++}
++++);
}|2285874|entityMap|0|LINK|mutability|MUTABLE|url|http://foundation.zurb.com/docs/components/tabs.html|1|http://diveintohtml5.info/history.html|2^0|0|3|0|0|0|0|3|0|0|0|0|G|9|0|G|B|W|9|0|0|0|0|0|0|0|11|H|7|8|0|0|0|0|0|0|B|5|1Y|4|0|0|B|D|1|0|0|0|0|0|4|0|0|0|0|1D|5|0|0|0|4|0|0|0|0|0|0|24|D|2|0|0|0|C|9|0|0|0|0|2|9|0|0|0|0|0|0|2|9|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|3W|8|@$9|3X|A|3Y|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|3Z|8|@]|D|@]|E|$]]|$1|H|3|I|5|6|7|40|8|@]|D|@]|E|$]]|$1|J|3|K|5|6|7|41|8|@$9|42|A|43|B|C]]|D|@]|E|$]]|$1|L|3|M|5|6|7|44|8|@]|D|@]|E|$]]|$1|N|3|O|5|6|7|45|8|@]|D|@]|E|$]]|$1|P|3|Q|5|R|7|46|8|@]|D|@]|E|$]]|$1|S|3|T|5|R|7|47|8|@$9|48|A|49|B|U]]|D|@]|E|$]]|$1|V|3|W|5|R|7|4A|8|@$9|4B|A|4C|B|U]|$9|4D|A|4E|B|U]]|D|@]|E|$]]|$1|X|3|Y|5|R|7|4F|8|@]|D|@]|E|$]]|$1|Z|3|10|5|R|7|4G|8|@]|D|@]|E|$]]|$1|11|3|12|5|6|7|4H|8|@]|D|@]|E|$]]|$1|13|3|14|5|6|7|4I|8|@]|D|@]|E|$]]|$1|15|3|16|5|6|7|4J|8|@]|D|@]|E|$]]|$1|17|3|18|5|19|7|4K|8|@]|D|@]|E|$1A|1B]]|$1|1C|3|1D|5|6|7|4L|8|@$9|4M|A|4N|B|U]]|D|@$9|4O|A|4P|1|4Q]]|E|$]]|$1|1E|3|1F|5|6|7|4R|8|@]|D|@]|E|$]]|$1|1G|3|1H|5|6|7|4S|8|@]|D|@]|E|$]]|$1|1I|3|1J|5|6|7|4T|8|@]|D|@]|E|$]]|$1|1K|3|1L|5|19|7|4U|8|@]|D|@]|E|$1A|1B]]|$1|1M|3|1N|5|6|7|4V|8|@$9|4W|A|4X|B|U]|$9|4Y|A|4Z|B|U]]|D|@]|E|$]]|$1|1O|3|1P|5|6|7|50|8|@]|D|@]|E|$]]|$1|1Q|3|1R|5|6|7|51|8|@]|D|@$9|52|A|53|1|54]]|E|$]]|$1|1S|3|1T|5|6|7|55|8|@]|D|@]|E|$]]|$1|1U|3|1V|5|6|7|56|8|@]|D|@]|E|$]]|$1|1W|3|1X|5|6|7|57|8|@]|D|@]|E|$]]|$1|1Y|3|1Z|5|6|7|58|8|@$9|59|A|5A|B|C]]|D|@]|E|$]]|$1|20|3|21|5|6|7|5B|8|@]|D|@]|E|$]]|$1|22|3|23|5|19|7|5C|8|@]|D|@]|E|$1A|1B]]|$1|24|3|25|5|6|7|5D|8|@]|D|@]|E|$]]|$1|26|3|27|5|6|7|5E|8|@$9|5F|A|5G|B|U]]|D|@]|E|$]]|$1|28|3|29|5|19|7|5H|8|@]|D|@]|E|$1A|1B]]|$1|2A|3|2B|5|6|7|5I|8|@$9|5J|A|5K|B|C]]|D|@]|E|$]]|$1|2C|3|2D|5|6|7|5L|8|@]|D|@]|E|$]]|$1|2E|3|16|5|6|7|5M|8|@]|D|@]|E|$]]|$1|2F|3|2G|5|19|7|5N|8|@]|D|@]|E|$1A|1B]]|$1|2H|3|2I|5|6|7|5O|8|@]|D|@]|E|$]]|$1|2J|3|2K|5|6|7|5P|8|@]|D|@]|E|$]]|$1|2L|3|2M|5|6|7|5Q|8|@]|D|@$9|5R|A|5S|1|5T]]|E|$]]|$1|2N|3|2O|5|6|7|5U|8|@]|D|@]|E|$]]|$1|2P|3|2Q|5|19|7|5V|8|@]|D|@]|E|$1A|1B]]|$1|2R|3|2S|5|6|7|5W|8|@$9|5X|A|5Y|B|U]]|D|@]|E|$]]|$1|2T|3|2U|5|6|7|5Z|8|@]|D|@]|E|$]]|$1|2V|3|2W|5|6|7|60|8|@]|D|@]|E|$]]|$1|2X|3|2Y|5|6|7|61|8|@]|D|@]|E|$]]|$1|2Z|3|30|5|6|7|62|8|@$9|63|A|64|B|U]]|D|@]|E|$]]|$1|31|3|32|5|R|7|65|8|@]|D|@]|E|$]]|$1|33|3|1J|5|6|7|66|8|@]|D|@]|E|$]]|$1|34|3|35|5|19|7|67|8|@]|D|@]|E|$1A|1B]]|$1|36|3|37|5|6|7|68|8|@]|D|@]|E|$]]|$1|38|3|2Y|5|6|7|69|8|@]|D|@]|E|$]]|$1|39|3|30|5|6|7|6A|8|@$9|6B|A|6C|B|U]]|D|@]|E|$]]|$1|3A|3|3B|5|R|7|6D|8|@]|D|@]|E|$]]|$1|3C|3|3D|5|R|7|6E|8|@]|D|@]|E|$]]|$1|3E|3|3F|5|R|7|6F|8|@]|D|@]|E|$]]|$1|3G|3|3H|5|R|7|6G|8|@]|D|@]|E|$]]|$1|3I|3|1J|5|6|7|6H|8|@]|D|@]|E|$]]|$1|3J|3|3K|5|19|7|6I|8|@]|D|@]|E|$1A|1B]]|$1|3L|3|-4|5|6|7|6J|8|@]|D|@]|E|$]]]|3M|$3N|$5|3O|3P|3Q|E|$3R|3S]]|3T|$5|3O|3P|3Q|E|$3R|3U]]|3V|$5|3O|3P|3Q|E|$3R|3U]]]]

<p><strong>Edit 1</strong>: I have have time to study how Foundation works. So I can make a more educated solution. My original idea was to mimic the effect of clicking on the items at css level. </p>

<p>This doesn't mean that the old solution didn't work. In fact the end result of both solutions in the same. I have tested both the old and the new solution on a copy of the HTML of your site.</p>

<p>Also took the opportunity to add some clarifications.</p>

<p><strong>Edit 2</strong>: I have added control over the broser history. This means that the code will change the url that the user sees and will handle tha back button correctly, all without reloading the page.</p>

<h2>Roadmap</h2>

<p>You have to do these:</p>

<ol>
<li>Adding an id to handle the tabs.</li>
<li>Creating a JavaScript function <code>selectTab</code> to switch among them. <em>depending on the solution you choose</em>.</li>
<li>Creating a JavaScript function <code>navigateTab</code> that will call <code>selectTab</code> but also update the browser history.</li>
<li>Adding the click event handlers.</li>
<li>Handle the back button.</li>
</ol>

<p>So, let's get the common parts first:</p>

<hr>

<h2>Adding an id to handle the tabs</h2>

<p>HTML:</p>

<pre><code>&lt;dl id="LOOK_MY_ID" class="tabs" data-tab&gt;
    &lt;dd class="active"&gt;&lt;a href="#panel2-1"&gt;Tab 1&lt;/a&gt;&lt;/dd&gt;
    &lt;dd&gt;&lt;a href="#panel2-2"&gt;Tab 2&lt;/a&gt;&lt;/dd&gt;
    &lt;dd&gt;&lt;a href="#panel2-3"&gt;Tab 3&lt;/a&gt;&lt;/dd&gt;
    &lt;dd&gt;&lt;a href="#panel2-4"&gt;Tab 4&lt;/a&gt;&lt;/dd&gt;
&lt;/dl&gt;
&lt;div class="tabs-content"&gt;
    &lt;div class="content active" id="panel2-1"&gt;
        &lt;p&gt;First panel content goes here...&lt;/p&gt;
    &lt;/div&gt;
    &lt;div class="content" id="panel2-2"&gt;
        &lt;p&gt;Second panel content goes here...&lt;/p&gt;
    &lt;/div&gt;
    &lt;div class="content" id="panel2-3"&gt;
        &lt;p&gt;Third panel content goes here...&lt;/p&gt;
    &lt;/div&gt;
    &lt;div class="content" id="panel2-4"&gt;
        &lt;p&gt;Fourth panel content goes here...&lt;/p&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p><em>Note</em>: this is based on the HTML presented in the <a href="http://foundation.zurb.com/docs/components/tabs.html" rel="nofollow">Example of Foundation Tabs</a>. In your code you would add the id to the div that has the class <code>corporation-frame</code>.</p>

<hr>

<h2>Creating the helper function</h2>

<p>The purpose of the helper function is to make the click event handlers easier while abstracting the code to change the browser url. We get arround this as seen below.</p>

<p>JavaScript:</p>

<pre><code>function navigateTab(event)
{
    var url = $(event.target).attr('href');
    var target = url.split('#')[1];
    if (target.substr(0, 3) == 'tab')
    {
        var state = {tab: target.substr(3)};
        selectTab("LOOK_MY_ID", state.tab); //&lt;-- change the tab
        history.pushState(state, null, url); //&lt;-- change the url
        event.preventDefault();
    }
}
</code></pre>

<p>As you can see it uses <code>event</code>, the reason behind this is that we are going to use this function directly as a click event handler. Also the tab to choose and the url to put are taken from the <code>href</code> attribute of the hyperlink that was clicked.</p>

<p>This technique also allows to safetly add the click event handler to all the links at once.</p>

<p><em>Note</em>: we are changing the url by making use of the <a href="http://diveintohtml5.info/history.html" rel="nofollow">HTML5's History API</a>.</p>

<hr>

<h2>Adding the event handlers</h2>

<p>You <em>need</em> to add an event handler to your links (Foundation add those to the tabs behind the scenes, we are going to mimic that for your menus).</p>

<p>There are two methods to add those event handler...</p>

<p><strong>Method A)</strong></p>

<p>Select your anchors and add the event handler via JavaScript:</p>

<pre><code>$('ul.dropdown a').on("click", navigateTab);
</code></pre>

<p>It doesn't get any simpler than that.</p>

<p><em>Note</em>: make sure to use the correct selector to select the hyperlinks from your menus. Also you may need (if you add your script on top of the page) to add this with <code>ready</code> like this:</p>

<pre><code>$(document).ready(
    function()
    {
        $('ul.dropdown a').on("click", navigateTab);
    }
);
</code></pre>

<p><strong>Method B)</strong></p>

<p>Add the event handler directly on the HTML:</p>

<p>HTML:</p>

<pre><code>&lt;a href="#tab3" onclick="navigateTab(event)"&gt;Tab 3&lt;/a&gt;
</code></pre>

<p><em>Note 1</em>: If JavaScript is disabled on the handler don't work, it will make the page jump to the contents (if they are visible). That's the best you can get without JavaScript.</p>

<hr>

<h2>Handling the back button</h2>

<p>In the previous code we are not only changing the url in the browser, but also we are adding an entry in the navigation history of the page... so, what happens when the user click back? Well, we are going to handle the back button, again by making use of <a href="http://diveintohtml5.info/history.html" rel="nofollow">HTML5's History API</a>.</p>

<p>To handle that we are going to add this code:</p>

<pre><code>window.onpopstate = function(event)
{
    selectTab("LOOK_MY_ID", event.state.tab); //&lt;-- change the tab
};
</code></pre>

<p>This is why we should not change the url from <code>selectTab</code>, because if we do... we won't be able to navigate back!</p>

<p><em>note</em>: this code doesn't only take care of the back button, but any navigation in the browser history inside of the page.</p>

<hr>

<h1>NEW SOLUTION</h1>

<hr>

<h2>Creating a JavaScript function to switch among them</h2>

<p>The function <code>selectTab</code> will be implemented by:</p>

<ol>
<li>Mimic what Foundation does (based on actual code from Foundation):</li>
</ol>

<p>JavaScript:</p>

<pre><code>function selectTab(id, tab)
{
    // activate only the right tab:
    var tab = $("#" + id + " &gt; dl &gt; dd:nth-child(" + tab + ")");
    var a = $("a", tab);
    target = $('#' + a.attr("href").split('#')[1]);
    siblings = tab.siblings();
    settings = tab.closest('[data-tab]').data('tab-init');

    tab.addClass(settings.active_class);
    siblings.removeClass(settings.active_class);
    target.siblings().removeClass(settings.active_class).end().addClass(settings.active_class);
}
</code></pre>

<hr>

<h1>OLD SOLUTION</h1>

<hr>

<h2>Creating a JavaScript function to switch among them</h2>

<p>The function <code>selectTab</code> will be implemented by:</p>

<ol>
<li>Make tab you want active</li>
<li>Make the corresponding content active</li>
<li>Make all other tabs not active</li>
<li>Make all other contents not active</li>
</ol>

<p>JavaScript:</p>

<pre><code>function selectTab(id, tab)
{
    // activate only the right tab:
    $("#" + id + " &gt; dl").children().each
    (
        function(index, element)
        {
            if (index == tab)
            {
                $(element).addClass("active");
            }
            else
            {
                $(element).removeClass("active");
            }
        }
    );
    // activate only the right content:
    $("#" + id + " &gt; div").children().each
    (
        function(index, element)
        {
            if (index == tab)
            {
                $(element).addClass("active");
            }
            else
            {
                $(element).removeClass("active");
            }
        }
    );
}
</code></pre>


<p>I don't know if this can be done with html but this is what I want to do. </p>

<p>I using foundation's <strong><a href="http://foundation.zurb.com/docs/components/tabs.html" rel="nofollow">tab</a></strong> and I want to navigate to any of the <strong>tab's content</strong> by clicking the links on the main navigation. The content of these sub-menus in the navigation are all on the same page. Please let me know if you don't understand so I can upload an image or something. the is the <a href="http://bmmisrq.com/bmmi-beta/the-corporation.html" rel="nofollow"><strong>link to it</strong></a>.</p>


Going to tab content by clicking main navigation

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我不知道这是否可以用html完成，但这是我想要做的。我使用基金会的，我想通过单击主导航上的链接导航到选项卡的内容中的任何一个。导航中这些子菜单的内容都在同一个页面上。如果你不明白，请告诉我，这样我就可以上传图片或其他东西了。这就是。

问单击主导航到选项卡内容
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问单击主导航到选项卡内容EN