0

AJAXを介して別のページからコンテンツを受信すると、アコーディオンが機能しないという問題があります。このページは次のとおりです：http：//jbm.utad.pt/testes/tempo/index.php

ページが読み込まれるとすぐに、デフォルトの都市名がprocesstempo.phpに送信され、AJAXを使用して結果がdivに返されます。

processtempo.phpには、アコーディオンのHTMLがありますが、そのjQueryはindex.phpにあります。HTMLがメインページにある必要があるため、このアコーディオンが機能していませんか、それともjQueryを台無しにしましたか？

ソースでアコーディオンjQueryスクリプトを表示できます...特定のjsファイルにはまだ入れていません。

可能な限りのすべての助けに感謝し、この漠然とした質問をお詫びします

乾杯

4

1 に答える 1

8

click()にイベントを割り当て、.tempo-head要素がajaxルーチンによってページに読み込まれる前に、要素に他の多くのことを実行します。

以下を機能させるには、最新バージョンのJQueryを入手する必要があります。現在、古いバージョンがあることに気づきました（1.4.2）

これを変更してみてください：

$('.tempo-head').click(function () {

に

$('#sidebar').on('click', '.tempo-head').click(function () {

また

以下のように、すべてのアコーディオンルーチンをsuccessajax呼び出しのコールバック内に移動します。

$(document).ready(function(){

    var cidade2='penafiel';
    var dataString = 'cidade='+ cidade2;
    $.ajax({ type: "POST", url: "processtempo.php", data: dataString, cache: false,
        success: function(html){
            $("#exibe_tempo").html(html);
        }
    });

    $(".cidade").change(function(){
        var cidade=$(this).val();
        var dataString = 'cidade='+ cidade;

        $.ajax({ type: "POST", url: "processtempo.php", data: dataString, cache: false,
            success: function(html){
                $("#exibe_tempo").html(html);

                //Add Inactive Class To All Accordion Headers
                $('.tempo-head').toggleClass('head-off');

                //Set The Accordion Content Width
                var contentwidth = $('.tempo-head').width();
                $('.tempo-cont').css({'width' : contentwidth });

                //Open The First Accordion Section When Page Loads
                //$('.tempo-head').first().toggleClass('head-on').toggleClass('head-off');
                //$('.tempo-cont').first().slideDown().toggleClass('tempo-cont');

                // The Accordion Effect
                $('.tempo-head').click(function () {        
                        if($(this).is('.head-off')) {
                            $('.head-on').toggleClass('head-on').toggleClass('head-off').next().slideToggle().toggleClass('tempo-cont');
                            $(this).toggleClass('head-on').toggleClass('head-off');
                            $(this).next().slideToggle().toggleClass('tempo-cont');
                        }

                        else {
                                $(this).toggleClass('head-on').toggleClass('head-off');
                                $(this).next().slideToggle().toggleClass('tempo-cont');
                        }

                });


            }
        });
    });


    return false;

}); // END DOC READY
于 2012-05-08T12:40:46.417 に答える