Twitter Bootstrap（3.0.0）Dropdown＆PrototypeJS

私はゆっくりとjQueryに変換しようとしているアプリケーションを持っています。&もブートストラップを使うつもりでした。Twitter Bootstrap（3.0.0）Dropdown＆PrototypeJS

しかし、ブートストラップ3を使用している場合、ドロップダウンをクリックした後、メニューが正しく表示されます。ただし、メニューをクリックするか、メニューを閉じることができます。ボタン/リンクは完全に消え、ページが更新されるまで再表示されません。

これと同じ：https://github.com/twbs/bootstrap/issues/8379

上記のリンクは、Googleのグループに連絡することを言いますが、私はグループでこのについては何も要求を見ていません。

ご協力いただければ幸いです！

おかげで、あなたはこれらの行をコメントアウトするのであれば、GeekNum88の指導@使用-David

は、ドロップダウンがないことを確認、それの総効果はまだ、作品：ブートストラップドロップを実装

function clearMenus() { 
    $(backdrop).remove() 
    $(toggle).each(function (e) { 
    var $parent = getParent($(this)) 
    if (!$parent.hasClass('open')) return 
//  $parent.trigger(e = $.Event('hide.bs.dropdown')) 
//  if (e.isDefaultPrevented()) return 
    $parent.removeClass('open').trigger('hidden.bs.dropdown') 
    }) 
}

出典

2013-08-22 dcmoody

好奇心ではない。古いバージョンのブートストラップを使ってみましたか？ http://getbootstrap.com/2.3.2/ ..もしそうなら、同じ結果が得られますか？ –

これは似たような質問に対する私の回答の1つです。http://stackoverflow.com/questions/15087129/popover-hides-parent-element-if-used-with-prototype-js/15095654#15095654 –

フレンドリーなこのブートストラップを試してみてくださいprototype.jsと同様の質問で問題を修正しました： http://stackoverflow.com/questions/19139063/twitter-bootstrap-3-dropdown-menu-disappears-when-used-with-prototype-js – MWD

ダウンメニューは非常に簡単な作業です。ブートストラップドキュメントのexampleを参照し、次の手順を実行します。

1.タグだけタイトルタグの下にヘッドとの間に次のライブラリを含めるを

jQueryライブラリが取得することを確認してくださいBoostrap JSライブラリの前にロードされます。

<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

2. 体タグ

<div class="btn-group"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> Action <span class="caret"></span> </button> <ul class="dropdown-menu" role="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> </div>

実施例の間に次のHTMLを貼り付け：を参照してください、それが機能していることを証明するために

<!doctype html> <html> <head> <meta charset="utf-8"> <title>Bootstrap Dropdown</title> <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> </head> <body> <div class="btn-group"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> Action <span class="caret"></span> </button> <ul class="dropdown-menu" role="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> </div> </body> </html>

をthe fiddle。

出典

2014-03-07 09:41:13 Eugene

*あなたは*の質問を読んだことがありますか？ – dashard

Twitter Bootstrap（3.0.0）Dropdown＆PrototypeJS

答えて

関連する問題