Twitter引导按钮在IE8中没有响应 [英] Twitter Bootstrap buttons are unresponsive in IE8
本文介绍了Twitter引导按钮在IE8中没有响应的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我的Twitter引导按钮在IE8中被完全忽略。当我点击任何按钮时，绝对没有任何反应。我在谷歌找不到任何东西，有没有人碰到过这个？
非常感谢，
解决方案
@Kave你只将简单的html上传到jsfiddle - 其中包含js的链接，这些链接不存在（所以当没有附加js时很难调试它）..
尝试使用href而不是那么多按钮.. twitter bootsrap支持链接样式看起来像按钮，例如在twitter bootstrap的第一页，如下所示:(源代码复制和修改后的位）：
< a class =btn btn-success btn-largehref =http://twitter.github.com /bootstrap/base-css.html\">带按钮样式的示例链接< / a>
编辑：或者，使用twitter bootstrap的完整示例（从演示模板修改 - 链接按钮英雄单位内的风格） - 复制&粘贴到文件，保存为testing.html并使用浏览器打开 - 享受！
<！DOCTYPE html>
< html lang =en>
< head>
< meta charset =utf-8>
< title> Bootstrap，来自Twitter< / title>
< meta name =viewportcontent =width = device-width，initial-scale = 1.0>
< meta name =descriptioncontent =>
< meta name =authorcontent =>
<！ - Le styles - >
< link href =http://getbootstrap.com/2.3.2/assets/css/bootstrap.css\"rel =stylesheet>
< style type =text / css>
body {
padding-top：60px;
padding-bottom：40px;
}
< / style>
< link href =http://getbootstrap.com/2.3.2/assets/css/bootstrap-responsive.css\"rel =stylesheet>
<！ - Le HTML5 shim，用于支持HTML5元素的IE6-8 - >
<！ - [if lt IE 9]>
< script src =http://html5shim.googlecode.com/svn/trunk/html5.js>< / script>
<！[endif] - >
<！ - Le fav和触摸图标 - >
< link rel =快捷图标href =http://getbootstrap.com/2.3.2/assets/ico/favicon.ico>
< link rel =apple-touch-icon-precomposedsizes =144x144href =http://getbootstrap.com/2.3.2/assets/ico/apple-touch-icon-144- precomposed.png>
< link rel =apple-touch-icon-precomposedsizes =114x114href =http://getbootstrap.com/2.3.2/assets/ico/apple-touch-icon-114- precomposed.png>
< link rel =apple-touch-icon-precomposedsizes =72x72href =http://getbootstrap.com/2.3.2/assets/ico/apple-touch-icon-72- precomposed.png>
< link rel =apple-touch-icon-precomposedhref =http://getbootstrap.com/2.3.2/assets/ico/apple-touch-icon-57-precomposed.png> ;
< / head>
< body>
< div class =container-fluid>
< div class =row-fluid>
< div class =span12>
< div class =hero-unit>
< h1> Hello，world！< / h1>
< p>这是一个简单的营销或信息网站的模板。它包括一个称为英雄单元的大型标注和三个支持的内容。使用它作为创建更独特的东西的起点。< / p>
< p>< a class =btn btn-success btn-largeonclick =alert（'its working :)'）>了解详情& raquo;< / a>< / p为H.
< / div>
< / div>
< / div>
< hr>
< footer>
< p>& copy;公司2012< / p>
< / footer>
< / div><！ - /。fluid-container - >
<！ - Le javascript
=============================== =================== - >
<！ - 放置在文档的末尾，以便页面加载更快 - >
< script src =http://getbootstrap.com/2.3.2/assets/js/jquery.js>< / script>
< script src =http://getbootstrap.com/2.3.2/assets/js/bootstrap-transition.js>< / script>
< script src =http://getbootstrap.com/2.3.2/assets/js/bootstrap-alert.js>< / script>
< script src =http://getbootstrap.com/2.3.2/assets/js/bootstrap-modal.js>< / script>
< script src =http://getbootstrap.com/2.3.2/assets/js/bootstrap-dropdown.js>< / script>
< script src =http://getbootstrap.com/2.3.2/assets/js/bootstrap-scrollspy.js>< / script>
< script src =http://getbootstrap.com/2.3.2/assets/js/bootstrap-tab.js>< / script>
< script src =http://getbootstrap.com/2.3.2/assets/js/bootstrap-tooltip.js>< / script>
< script src =http://getbootstrap.com/2.3.2/assets/js/bootstrap-popover.js>< / script>
< script src =http://getbootstrap.com/2.3.2/assets/js/bootstrap-button.js>< / script>
< script src =http://getbootstrap.com/2.3.2/assets/js/bootstrap-collapse.js>< / script>
< script src =http://getbootstrap.com/2.3.2/assets/js/bootstrap-carousel.js>< / script>
< script src =http://getbootstrap.com/2.3.2/assets/js/bootstrap-typeahead.js>< / script>
< / body>
< / html>
如果仍无法正常工作，请确保在重新启动IE时单击允许阻止的内容，如果弹出询问它显示出来。
IE is a mystery to me. My web app is working on Safari, Firefox, Chrome, even iPhones and iPads, but when it comes to IE, I simply can't comprehend how hard it is to comply to the given standards. Anyway enough ranting.
My Twitter bootstrap buttons are completely ignored in IE8. Absolutely nothing happens when I click on any button. I couldnt find anything on google, has anyone come across this?
Many Thanks,
解决方案
@Kave You uploaded only plain html to jsfiddle - which includes links to js which doesn't exists (so its kind of hard to debug when js is not attached)..
Try using a href instead of so many buttons.. twitter bootsrap supports styling of links to look like buttons, example is at first page of twitter bootstrap like this: (source copied & bit of modified):
<a class="btn btn-success btn-large" href="http://twitter.github.com/bootstrap/base-css.html">Example link with button styles</a>
Edit: Alternatively, full example with twitter bootstrap (modified from demo templates - link with button styles inside a hero unit) - copy & paste to file, save as testing.html and open with browser - enjoy!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Bootstrap, from Twitter</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<!-- Le styles -->
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet">
<style type="text/css">
body {
padding-top: 60px;
padding-bottom: 40px;
}
</style>
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap-responsive.css" rel="stylesheet">
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="http://getbootstrap.com/2.3.2/assets/ico/favicon.ico">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="http://getbootstrap.com/2.3.2/assets/ico/apple-touch-icon-144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="http://getbootstrap.com/2.3.2/assets/ico/apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="http://getbootstrap.com/2.3.2/assets/ico/apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="http://getbootstrap.com/2.3.2/assets/ico/apple-touch-icon-57-precomposed.png">
</head>
<body>
<div class="container-fluid">
<div class="row-fluid">
<div class="span12">
<div class="hero-unit">
<h1>Hello, world!</h1>
<p>This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
<p><a class="btn btn-success btn-large" onclick="alert('its working :)')">Learn more »</a></p>
</div>
</div>
</div>
<hr>
<footer>
<p>© Company 2012</p>
</footer>
</div><!--/.fluid-container-->
<!-- Le javascript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="http://getbootstrap.com/2.3.2/assets/js/jquery.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-transition.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-alert.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-modal.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-dropdown.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-scrollspy.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-tab.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-tooltip.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-popover.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-button.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-collapse.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-carousel.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-typeahead.js"></script>
</body>
</html>
IF still not working, make sure when you restart IE that you click "Allow blocked content" if pop-up for asking it is shown.
这篇关于Twitter引导按钮在IE8中没有响应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
