- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时,我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
我已经阅读了 stackoverflow 上关于导航栏中的 dropdown box
的许多线程,但没有一个对我的问题有帮助。
我使用的是 bootstrap 版本 3,我使用的是官方网站上提供的 navbar
示例:
http://getbootstrap.com/components/#navbar
我使用的代码与该站点上的代码完全相同,我包括以下 javascript 和 css 文件:
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="static/js/transition.js"></script>
<script type="text/javascript" src="static/js/collapse.js"></script>
<script type="text/javascript" src="static/js/dropdown.js"></script>
<script type="text/javascript" src="static/js/bootstrap.js"></script>
<link rel="stylesheet" href="static/css/bootstrap.css" type="text/css">
<link rel="stylesheet" href="static/css/footer.css" type="text/css">
除了 jquery
文件,我还下载了不同的 js
和 css
文件。我之前可以正常工作,但现在即使经过大量故障排除也无法正常工作,当时脚本标签的顺序是错误的。
根据 bootstrap 网站,jquery
插件是必需的,此外折叠插件依赖于转换插件(因此它位于折叠插件之前)。然后是 dropdown js
和 bootstrap,还有 css
文件。
我不明白为什么这不起作用。问题是,当我单击 dropdown
框时,它根本不显示菜单,没有任何反应。我尝试了很多不同的配置,但没有任何效果。
我正在使用这段代码:
<html
<head>
<title>testing</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="static/js/transition.js"></script>
<script type="text/javascript" src="static/js/collapse.js"></script>
<script type="text/javascript" src="static/js/dropdown.js"></script>
<script type="text/javascript" src="static/js/bootstrap.js"></script>
<link rel="stylesheet" href="static/css/bootstrap.css" type="text/css">
<link rel="stylesheet" href="static/css/footer.css" type="text/css">
</head>
<body>
<nav class="navbar navbar-default" role="navigation">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Brand</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Separated link</a></li>
<li class="divider"></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
<form class="navbar-form navbar-left" role="search">
<div class="form-group">
<input type="text" class="form-control" placeholder="Search">
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Link</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</nav>
</body>
</html>
我还尝试用 erikrunia 在他的一个回复中写的代码替换所有导入,这也与示例站点上的相同。
这是浏览器呈现页面时的样子:
在站点上运行调试器后,我收到了这些警告/错误,但在访问 Bootstrap 站点本身时我也收到了很多这样的警告/错误,所以我不知道它们是否与实际问题有关:
18:23:45.672 file:///Users/exceed/index.html
18:23:45.673 file:///Users/exceed/static/js/jquery.js
18:23:45.674 file:///Users/exceed/static/js/transition.js
18:23:45.674 file:///Users/exceed/static/js/collapse.js
18:23:45.675 file:///Users/exceed/static/js/dropdown.js
18:23:45.675 file:///Users/exceed/static/js/bootstrap.js
18:23:45.676 file:///Users/exceed/static/css/bootstrap.css
18:23:45.676 file:///Users/exceed/static/css/footer.css
18:23:45.643 Unknown property 'box-sizing'. Declaration dropped. bootstrap.css:93
18:23:45.643 Unknown property 'box-sizing'. Declaration dropped. bootstrap.css:195
18:23:45.643 Unknown property 'box-sizing'. Declaration dropped. bootstrap.css:201
18:23:45.643 Unknown pseudo-class or pseudo-element '-webkit-search-cancel-button'. Ruleset ignored due to bad selector. bootstrap.css:205
18:23:45.644 Unknown property 'box-sizing'. Declaration dropped. bootstrap.css:306
18:23:45.644 Expected color but found 'auto'. Expected color but found '-webkit-focus-ring-color'. Expected end of value but found '-webkit-focus-ring-color'. Error in parsing value for 'outline'. Declaration dropped. bootstrap.css:344
18:23:45.645 Unknown property 'box-sizing'. Declaration dropped. bootstrap.css:1882
18:23:45.645 Expected end of value but found '\9 '. Error in parsing value for 'margin-top'. Declaration dropped. bootstrap.css:1888
18:23:45.645 Expected color but found 'auto'. Expected color but found '-webkit-focus-ring-color'. Expected end of value but found '-webkit-focus-ring-color'. Error in parsing value for 'outline'. Declaration dropped. bootstrap.css:1913
18:23:45.645 Unknown pseudo-class or pseudo-element '-webkit-outer-spin-button'. Ruleset ignored due to bad selector. bootstrap.css:1917
18:23:45.645 Unknown pseudo-class or pseudo-element '-ms-input-placeholder'. Ruleset ignored due to bad selector. bootstrap.css:1965
18:23:45.645 Unknown pseudo-class or pseudo-element '-webkit-input-placeholder'. Ruleset ignored due to bad selector. bootstrap.css:1969
18:23:45.646 Unknown property 'user-select'. Declaration dropped. bootstrap.css:2262
18:23:45.646 Expected color but found 'auto'. Expected color but found '-webkit-focus-ring-color'. Expected end of value but found '-webkit-focus-ring-color'. Error in parsing value for 'outline'. Declaration dropped. bootstrap.css:2267
18:23:45.646 Expected 'none' or URL but found 'alpha('. Error in parsing value for 'filter'. Declaration dropped. bootstrap.css:2291
18:23:45.647 Expected 'none' or URL but found 'progid'. Error in parsing value for 'filter'. Declaration dropped. bootstrap.css:3555
18:23:45.650 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:5459
18:23:45.650 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:5460
18:23:45.650 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:5476
18:23:45.650 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:5477
18:23:45.650 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:5487
18:23:45.650 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:5488
18:23:45.650 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:5498
18:23:45.650 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:5499
18:23:45.650 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:5509
18:23:45.650 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:5510
18:23:45.650 Unknown property 'zoom'. Declaration dropped. bootstrap.css:5518
18:23:45.651 Expected 'none' or URL but found 'alpha('. Error in parsing value for 'filter'. Declaration dropped. bootstrap.css:5964
18:23:45.651 Expected 'none' or URL but found 'alpha('. Error in parsing value for 'filter'. Declaration dropped. bootstrap.css:5973
18:23:45.651 Expected 'none' or URL but found 'alpha('. Error in parsing value for 'filter'. Declaration dropped. bootstrap.css:6049
18:23:45.651 Expected 'none' or URL but found 'alpha('. Error in parsing value for 'filter'. Declaration dropped. bootstrap.css:6054
18:23:45.651 Expected 'none' or URL but found 'alpha('. Error in parsing value for 'filter'. Declaration dropped. bootstrap.css:6136
18:23:45.651 Expected 'none' or URL but found 'alpha('. Error in parsing value for 'filter'. Declaration dropped. bootstrap.css:6142
18:23:45.651 Expected 'none' or URL but found 'alpha('. Error in parsing value for 'filter'. Declaration dropped. bootstrap.css:6454
18:23:45.651 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:6458
18:23:45.651 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:6459
18:23:45.651 Expected 'none' or URL but found 'progid'. Error in parsing value for 'filter'. Declaration dropped. bootstrap.css:6463
18:23:45.651 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:6469
18:23:45.651 Error in parsing value for 'background-image'. Declaration dropped. bootstrap.css:6470
18:23:45.651 Expected 'none' or URL but found 'progid'. Error in parsing value for 'filter'. Declaration dropped. bootstrap.css:6474
18:23:45.651 Expected 'none' or URL but found 'alpha('. Error in parsing value for 'filter'. Declaration dropped. bootstrap.css:6482
18:23:45.651 Expected end of value but found '\9 '. Error in parsing value for 'background-color'. Declaration dropped. bootstrap.css:6541
18:23:45.658 TypeError: $(...).on is not a function collapse.js:160
18:23:45.659 TypeError: $(...).on is not a function dropdown.js:149
18:23:45.661 TypeError: $(...).on is not a function bootstrap.js:163
18:23:45.662 The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol. index.html
最佳答案
尝试使用 bootstrap 提供的 CDN 链接而不是您的导入来确定是您的标记导致问题还是您的 JS 导入。
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
另外,请仔细检查您的导航栏 html 标记是否正确。下拉菜单是嵌入构成导航栏的更高级别 ul/li 中的另一个 UL。
最后,您的 <html>
标签看起来像 <html
,这会导致问题。还要放入适当的文档类型和元视口(viewport)
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
... rest of your code
关于javascript - Bootstrap 导航栏下拉框不显示下拉菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21064146/
我试图让我的 jQuery 脚本从单击的链接中提取 url,然后将其插入到我的视频标签中。有什么建议吗? 我试过拼接我从 .html() 中得到的内容,但引号总是搞砸了。
我遇到了 docker 的问题。 场景是这样的:我们使用Codebuild+Packer+docker创建AMI,用于deploy。在这一步中,我们从 Artifactory 中提取图像,并且除了提取
我目前正在学习 RxJS。 在文档中,我找到了这个数组。 我尝试在谷歌上搜索“pull and push javascript”,但我什至不知道如何调用这些实体/概念。我不明白那是什么意思?我假设 S
Title 在小屏幕上,我首先需要标题,然后是文本字段,但在中等以上的屏幕上,我需要相反的方式 - 我已经尝试过推和拉,但它们无法工作 - 有什么想法吗? 最佳答案 根据 Swa
zmq 的某些部分未以可预测的方式运行。 我正在使用 VS2013 和 zmq 3.2.4。为了不在我的 pubsub 框架中“丢失”消息 [旁白:我认为这是一个设计缺陷。我应该能够首先启动我的订阅者
我正在编写一个使用嵌套 Bootstrap 列的页面。我正在使用推/拉让列在移动设备上切换位置,而且效果很好。但是,在桌面上我遇到了一些奇怪的间距问题。嵌套列偏移到父列的右侧。 我设置了一个 fidd
在拉取一些 docker 镜像(但不是全部)时出现此错误: failed to register layer: Error processing tar file(exit status 1): op
我创建了一个 Kubernetes 集群,并为每个节点安装了 docker。 当我尝试使用 docker push local_registry_addr:port/image_id 将图像拉取或推送
没有明确地推/拉单个书签,书签何时从 repo 复制/更新到 repo? 在我对两个本地存储库的测试中,我无法推断出一致的行为。有时从 A 到 B 或 B 到 A 的推/拉会复制/更新书签,有时不会。
在 Bootstrap 3 文档中,他们给出了以下使用 push 和 pull 类更改列顺序 (http://getbootstrap.com/css/#grid-column-ordering) 的
从这个问题开始Three column Bootstrap layout with left sidebar at bottom我了解了 Bootstrap 列推拉。 下面的代码片段几乎可以得到我想要
许多 Repo 函数的签名包括 **kwargs,其中文档说,您可以将参数传递给底层包装的 git 命令。但是,*args 没有位置。为了传递类似标志的参数,如 --all。我原以为它们会像 my_r
如果您将大文件推送/拉到设备上,这真的很烦人,现在无法知道它有多远。是否可以运行 adb push 或 adb pull 并使用“bar”实用程序获取进度条? 这里的主要问题是我认为 adb 需要两个
当我尝试使用 Gitkrakent 向/从 Heroku 推/拉时,GitKraken 告诉我: "Please log in to continue" 请求的“用户/登录”是什么? (我个人 Her
我在 docker 容器中有一个 Jenkins 2.150.1。要安装这个 Jenkins,我只需使用 jenkinsci/blueocean:1.9.0图片。 我创建了一个管道,然后尝试使用我的
我想使用 Jenkins 做下一步: 1- docker pull 2- docker run -i -t 我已经在jenkins上安装了docker插件,但是这可行吗? docker plugi
如果我正在处理一些我不想提交的文件,我只需保存它们。然后我有其他文件想要推送到服务器,但是如果其他人对存储库进行了更改,并且我将它们拉下来,它会要求我 merge 或 rebase ..但是这些选项中
无论出于何种原因,我在 FB 上共享链接时尝试使用的图像都无法加载。给出的确切错误是: 提供了og:image,无法下载。发生这种情况的原因有多种,例如您的服务器使用不受支持的内容编码。爬虫接受 de
今天我买了三星 Galaxy Note 3,它配备了 Android 4.3。由于它太新了,我找不到根植我设备的方法,所以我尝试使用 adb 连接……我失败了。 所以,我用了这个 D:\android
我尝试通过 airflow cli test 命令测试 2 个任务` 第一个任务运行,自动将最后一个控制台推送到 xcom,我按预期在 Airflow GUI 中看到了值 some value 当我通
我是一名优秀的程序员,十分优秀!