Question

我知道你们都可能认为on（）是解决方案，我希望如此，但是我已经尝试过但无法弄明白。我有jQuery函数使用（'audio'）为jPlayer创建播放列表。音乐分为类别和帖子我希望播放器在浏览类别时加载来自帖子的歌曲。所以它就像：

var songsforjplayer = [];   
    $('body').append('<div id="newsongs" style=""></div>');
    $('#newsongs').load('http://sample_post audio');

    var singlesonglist = $('audio'); //selector doesn't recognize freshly load audio so it doesnt include them inplaylist
    singlesonglist.each(function(i){
        var source = $(this).attr('src');
        songsforjplayer[i]= {
            title:  $('track',this).attr('src'),
            oga: source,
        }

        });

我尝试使用各种事件类型的on（） - 事实是，没有事件 - 它应该在类别页面准备就绪时触发，但它不会使选择器捕获新的音频标记。

有什么想法吗？

Answer 1

每次加载新音频时，您都必须重新运行此代码以使用页面中的任何新音频刷新播放列表，并且必须在.load（）完成后使用完成功能运行代码.load（）方法。一种方法是这样的：

var songsforjplayer;

function updatePlaylist() {
    songsforjplayer = [];
    var singlesonglist = $('audio');
    singlesonglist.each(function() {
        var source = $(this).attr('src');
        songsforjplayer.push({
            title:  $('track',this).attr('src'),
            oga: source
        });
    });
}

$('body').append('<div id="newsongs" style=""></div>');
$('#newsongs').load('http://sample_post audio', updatePlaylist);

请记住.load()是异步的。它需要一段时间才能完成，并且在其他代码运行时它会在后台运行。调用.load()之后的代码在.load()完成之前运行。保证在完成.load()之后运行一段代码的唯一方法是使用我在上面的代码中显示的完成函数。

我还在oga: source之后删除了一个额外的逗号，这在旧版本的IE中会出错。

Answer 2

问题是load（）是一个ajax方法。根据定义，AJAX是异步的，因此您的播放器代码在加载完成之前就已运行。您需要从加载成功回调中调用您的插件

var songsforjplayer = [];
$('body').append('<div id="newsongs" style=""></div>');
$('#newsongs').load(url, function() {
    /* inisde the success callback the new html exists and can now attach events */
    var singlesonglist = $('audio'); //selector doesn't recognize freshly load audio so it doesnt include them inplaylist
    singlesonglist.each(function(i) {
        var source = $(this).attr('src');
        songsforjplayer[i] = {
            title: $('track', this).attr('src'),
            oga: source,
        }

    });
});

jQuery选择器不会读取document.ready（）上的load（）内容？

2 个答案: