2

IEは私には謎です。私のWebアプリはSafari、Firefox、Chrome、さらにはiPhoneやiPadでも動作しますが、IEに関しては、特定の標準に準拠することがどれほど難しいかを理解できません。とにかく十分に怒鳴る。

私のTwitterブートストラップボタンはIE8では完全に無視されます。ボタンをクリックしても何も起こりません。私はグーグルで何も見つけることができませんでした、誰かがこれに出くわしましたか？

どうもありがとう、

4

3 に答える 3

5

@Kaveあなたはプレーンなhtmlだけをjsfiddleにアップロードしました-これには存在しないjsへのリンクが含まれています（したがって、jsが接続されていない場合はデバッグが困難です）。

多くのボタンの代わりにhrefを使用してみてください。twitterbootsrapは、ボタンのように見えるリンクのスタイル設定をサポートしています。例は、次のようなTwitterブートストラップの最初のページにあります。

<a class="btn btn-success btn-large" href="http://twitter.github.com/bootstrap/base-css.html">Example link with button styles</a>

編集：または、Twitterブートストラップを使用した完全な例（デモテンプレートから変更-ヒーローユニット内のボタンスタイルとリンク） -コピーしてファイルに貼り付け、testing.htmlとして保存し、ブラウザで開きます-お楽しみください！

<!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 &raquo;</a></p>
          </div>
        </div>
      </div>

      <hr>

      <footer>
        <p>&copy; 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>

それでも機能しない場合は、IEを再起動するときに、確認するためのポップアップが表示されたら、[ブロックされたコンテンツを許可する]をクリックしてください。

于 2012-08-20T18:24:02.857 に答える
0

ブロックされたコンテンツを許可すると、javascript コンテンツが参照されます。ボタンは純粋に CSS コードです。問題は、IE 6....8 が CSS3 を十分にサポートしていないことです。getbootstrao.com Web サイトを見ると、それらが独自のボタンを使用していることはわかりません :)) 最良の解決策は、シンプルな CSS を使用してボタンを作成することです。実際の正方形だが機能するボタンを見つけます。

于 2014-12-10T10:14:05.543 に答える