1

コンテナにアコーディオンが入っています：

<div id="address_results"></div>

ここで、 ajax呼び出しを介してhtml（アコーディオン）を入力します。正常に動作しますが、最初のajax呼び出しによってのみ機能します。2回目、3回目などの呼び出しでは、アコーディオンのアニメーションは機能しません。

// Ajax request
        $(this).submit(function() {
            var postal = $(o.postalDiv).val();

            $.getJSON(o.url,{ action: o.action, id: o.id, postal: postal } , function(json) {
                var result = json.content;
                var addresses = result['addresses'];
                var strXML = result['xml'];

                outputHtml(addresses);

            });
            return false;
        });

        // Ajax request success
        function outputHtml(addresses) {

            $(o.resultsDiv).html(addresses);

            // Generate the accordion
            $(o.resultsDiv).accordion({

                autoHeight: false,
                header:'div.toggler',
                active: false,
                collapsible: true
            });

divアコーディオンを入力する前に削除/追加すると、次のようになります。

$('#addresses_results').remove();
$('#reswrapper').append('<div id="address_results"></div>');

その後、正常に動作します。しかし、これは正しい方法である可能性がありますか？

（申し訳ありませんが、私の英語は私の母国語ではありません）ありがとう！

4

2 に答える 2

1

試す ：

 $('#addresses_results').accordion('destroy').accordion();
于 2013-01-29T11:33:08.407 に答える
1

最初の ajax 呼び出しまでにアコーディオンが存在しないため、次の行は機能しません。

$('#addresses_results').accordion('destroy').accordion();

解決策は、アコーディオンが既に存在するかどうかを確認することです。

 if ($(o.resultsDiv).hasClass('ui-accordion')) {
     $(o.resultsDiv).accordion('destroy');
  }

ソリューション全体:

    (function ($) {

    $.fn.address = function (options) {
        var defaults = {
            url:           '/ajax.php',
            action:        'fmd',
            id:             0,
            resultsDiv:    '#address_results',
            postalDiv:     '#address_postal'
        };
        var o = $.extend(defaults,options);

        // Ajax request
        $(this).submit(function() {
            var postal = $(o.postalDiv).val();

            $.getJSON(o.url,{ action: o.action, id: o.id, postal: postal } , function(json) {
                var result = json.content;
                var addresses = result['addresses'];
                var strXML = result['xml'];

                outputHtml(addresses);

            });
            return false;
        });

        // Ajax request success
        function outputHtml(addresses) {

            $(o.resultsDiv).html(addresses);

            // Check if the accordion already exist. if so destroy it
            if ($(o.resultsDiv).hasClass('ui-accordion')) {
                $(o.resultsDiv).accordion('destroy');
            }

            // Generate the accordion
            $(o.resultsDiv).accordion({
                autoHeight: false,
                header:'div.toggler',
                active: false,
                collapsible: true
            });
        }

    };
})(jQuery);

ありがとう！

于 2013-01-29T20:46:47.943 に答える