10

ajax呼び出しを使用してhtmlをロードしていますが、このhtmlにはBootstrapCollapseがあります。問題は、折りたたみが機能しないことです。クリックすると展開されますが、再び折りたたまれません。

私が何か間違ったことをしていないかどうかを確認するために、同じコードを静的ページ(ajaxを使用してロードされていない)に配置すると、正常に動作します。したがって、動的にロードされたhtmlでのみ問題が発生するようです。

手動で折りたたみを有効にしてみました

$(".collapse").collapse() 

しかし、それでも同じ問題。

live() / on()htmlは動的であるため、jqueryのメソッドを使用する必要が$(".collapse").collapse()あると思いますが、イベントでのみ機能すると思うので、呼び出す方法がわかりません。

4

3 に答える 3

8

電話することをお勧めします

 $(".collapse").collapse() 

ダイナミックHTMLが追加された後のajaxのsuccess関数内。

于 2012-12-17T09:54:01.853 に答える
4

私の解決策は次のとおりです。

    $('.collapse').on('show', function () {
    var $this = $(this);
    if($this.attr('data-href'))
    {
        $this.html($.getJSON($this.attr('data-href'),function(data){
            $this.html(data.html);
            $this.removeAttr('style');
        }));
    }
    })
于 2013-03-20T10:57:08.200 に答える
1

これをajax成功イベントで実行するだけです。

$('[data-toggle="collapse"]').click(function(e){
      e.preventDefault();
      var target_element= $(this).attr("href");
      $(target_element).collapse('toggle');
      return false;
});
于 2016-04-02T19:15:31.313 に答える