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

在 ajax 例程将元素加载到页面之前，您正在为元素分配一个click()事件.tempo-head，并对元素执行一系列其他操作。

您需要获取最新版本的 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 回答