12

ブートストラップで新しいワードプレス テンプレートを作成しようとしています。ドロップダウン メニューが正しく機能しません。2 回目のクリックの後、display:none が表示されます。解こうとしたけど無理だった！ここに私のウェブサイトアドレスがあります:サブメニューのあるサービスをチェックしてください

これも私のコードです：

<li id="menu-item-286" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-286 dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Services <b class="caret"></b></a>
    <ul class="dropdown-menu">
        <li id="menu-item-228" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-228">
            <a href="http://seoirvine.co/business-directories-irvine/" class="dropdown-toggle" data-toggle="dropdown">Business Directories</a>
        </li>
        <li id="menu-item-231" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-231">
            <a href="http://seoirvine.co/ppc-optimization-irvine/" class="dropdown-toggle" data-toggle="dropdown">PPC optimization</a>
        </li>
        <li id="menu-item-232" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-232">
            <a href="http://seoirvine.co/press-release-and-blogs-irvine/" class="dropdown-toggle" data-toggle="dropdown">Press Release and Blogs</a>
        </li>
        <li id="menu-item-234" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-234">
            <a href="http://seoirvine.co/seo-sem-irvine/" class="dropdown-toggle" data-toggle="dropdown">SEO &amp; SEM Irvine</a>
        </li>
        <li id="menu-item-238" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-238">
            <a href="http://seoirvine.co/social-media-marketing-irvine/" class="dropdown-toggle" data-toggle="dropdown">Social Media Marketing</a>
        </li>
        <li id="menu-item-239" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-239">
            <a href="http://seoirvine.co/video-irvine/" class="dropdown-toggle" data-toggle="dropdown">Video Blogging</a>
        </li>
    </ul>
</li>
4

7 に答える 7

6

問題は、ドロップダウンが元に戻ると、style="display: none;"に追加されること<li id="menu-item-286">です。コードに問題はないと思いますが、他のJSの量を考えると、競合が発生する可能性があります。

「mootools.js」を削除してみましたが、問題は解決しました。

于 2013-08-12T12:27:20.593 に答える
4

私の場合、問題の原因となったのは、bootstrap.js および jquery.js と一緒に実行されているprototype.js でした。

問題の説明は次のとおりです: https://github.com/twbs/bootstrap/issues/6921。現在は「修正されない」問題であり、特に jQuery を使用したくない場合は、Bootstrap の PrototypeJS フォークがあるようです。

私の最善の解決策は、CSS を適用するか、要素を何に使用しているdisplay:block !important;かに応じて、プロトタイプによって適用されているものをオーバーライドすることでした。inline-blockdisplay:none;

それが役立つことを願っています

于 2015-05-27T20:35:51.777 に答える
3

私はbootstrap.jsの行番号777を更新しました

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

これで問題は解決しました

于 2014-03-11T06:01:09.910 に答える
1

これをやってみてください。

HTMLで

<ul id="myTab" class="nav nav-tabs">
    <li class="active"><a href="#link1" data-toggle="tab">Link1</a></li>
    <li><a href="#Link2" data-toggle="tab">Link1</a></li>   
</ul>
<div class="tab-content">
    <div class="tab-pane fade in active" id="link1">
        LINK1
    </div>
    <div class="tab-pane fade" id="web_design">
        LINK2
    </div>
</div>

JavaScript で

window.addEvent('domready',function() {    
    Element.prototype.hide = function() {
       $(function () { 
         $('#myTab li:eq(1) a').tab('show');
       });    
    };
});
于 2015-08-15T21:13:12.830 に答える