Question

基本上，我正在创建一个广播电台应用程序（到目前为止一直很好！），我基本上需要在用户浏览应用程序时连续播放底部的音频播放器。（这是用Javascript编写的 - 使用phonegap构建）但显然当用户转到另一个页面时，音频停止，他们必须再次点击播放。

我已经想过解决这个问题的方法（AJAX导航）并且它有效，它很棒但是这一切都是我用来执行此操作的代码：

 $(document).ready(function(){
        $( "a" ).on( "click", function( event ){
          event.preventDefault();

           $.get($(this).attr("href"), function(data) {
                var resp = $(data);

                $("#pageContent").html($("#pageContent", resp).html());


            }); 
        });
});

正如你所看到的，它基本上交换了名为＆＃34; pageContent＆＃34;在其他页面上使用相同的div，但我在其他页面上有其他jquery元素（例如jquery主题列表，表单，按钮等），当我以这种方式导航时，它在jquery中没有任何样式，它将表单作为基本的HTML和即时通讯假设它，因为它没有重新加载什么头脑？

我尝试过很多东西，比如

$("head").html($("head", resp).html());

那不起作用:-(

所以我想知道是否有人可以提供帮助？

非常感谢。

Answer 1

您有两种选择：

加载一个共享的CSS文件，其中包含所有页面中所需的所有样式或
加载内联样式

如果您选择第二个选项，则需要阅读所有css文件，如下所示：

$(document).ready(function(){
                $( "a" ).on( "click", function( event ){
                        event.preventDefault();
                        $.get($(this).attr("href"), function(data) {
                                var html = $.parseHTML(data);
                                $("#pageContent").html($('<div></div>').append(data).find('#pageContent').html());
                                var styles="";
                                $.each( html, function( i, el ) {
                                    if(el.nodeName=='LINK'){
                                        $.get($(el).attr('href'),function(data){
                                            $("#pageContent").append($("<style></style>").html(data));
                                        });
                                    }
                                });
                        }); 
                });
        });

我希望它有所帮助。

Jquery移动AJAX导航没有加载jquery元素？

1 个答案: