gpt4 book ai didi

javascript - 加载特定的 Bootstrap 选项卡

转载 作者:太空宇宙 更新时间:2023-11-04 13:19:11 25 4
gpt4 key购买 nike

我的 View 文件夹中有一个选项卡系统,我需要在页面加载时加载一个特定的选项卡。

我知道这里有人问过这个确切的问题 Twitter Bootstrap Tabs: Go to Specific Tab on Page Reload or Hyperlink

但我尝试过的一切都没有奏效。最后,我想根据按下的链接加载一个选项卡,但现在我只是想从一开始就加载一个特定的选项卡。

在我的 View 文件中有

<head>
<script>


$('#myTab a').click(function (e) {
e.preventDefault()
$(this).tab('show')
})

$('#myTab a[href="#email-skills"]').tab('show');
</script>
</head>

我的标签系统是这样的

<ul class="nav nav-tabs nav-stacked" style = "margin-top: 10px" id="myTab">
<li class = ""><a href="#basic-computer-skills" data-toggle="tab">Basic Computer Skills</a></li>
<li><a href="#advanced-computer-skills" data-toggle="tab">Advanced Computer Skills</a></li>
<li><a href="#multi-media-skills" data-toggle="tab">Multi-Media Skills</a></li>
<li><a href="#word-processing-skills" data-toggle="tab">Word Processing Skills</a></li>
<li><a href="#spreadsheet-skills" data-toggle="tab">Spreadsheet Skills</a></li>
<li><a href="#presentation-skills" data-toggle="tab">Presentation Skills</a></li>
<li><a href="#email-skills" data-toggle="tab">Email Skills</a></li>
<li><a href="#internet-skills" data-toggle="tab">Internet/Network Skills</a></li>
<li><a href="#social-media-skills" data-toggle="tab">Social Media Skills</a></li>
<li><a href="#online-skills" data-toggle="tab">Online Collaboration</a></li>
</ul>

我知道有很多关于如何做到这一点的帖子,bootstrap 在他们的网站上有自己的 javascript,但没有任何效果。有谁知道我可能做错了什么?此外,当我单击它们时,我的选项卡会起作用,因此我认为这不是语法错误。我所有让它加载特定选项卡的尝试都失败了。我知道 class = "active"但这对我的最终目标没有帮助。

我也在用gems

gem 'twitter-bootstrap-rails'
gem 'bootstrap-will_paginate', '0.0.9'
gem 'bootstrap-sass', '3'

最佳答案

你可以使用这个函数:

$(function () {

$('ul.nav a.classtobeloaded').tab('show')


})

关于javascript - 加载特定的 Bootstrap 选项卡,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24195001/

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