javascript - 使用附加音频

Question

我有附加音频的问题。
当页面滚动时，我正在动态加载音频，但是，当我尝试播放它时，div，位于其中的音频文件没有改变它的属性，如何解决这个问题？
我如何附加:

$(window).scroll(function(){
            if(scrollCount == 0){
                if($(window).scrollTop() > 200){
                    AddMoreContent();
                }
            } else{
                if($(window).scrollTop() > $(window).height() * scrollCount - 100) {
                    AddMoreContent();
                }
            }
        });  

     function AddMoreContent(){
         $.ajax({url:thisPage + "/" + thisPage + "." + scrollCount +".html",context: document.body, success: function(response){
                $("#main-content").append(response);
             scrollCount++;
         }
        });
     }

我如何收听音频事件:

$(document).ready(function () {
        $("audio").on("play", function () {
            var _this = $(this);
            //$("audio").each(function (i, el) {
            //    if (!$(el).is(_this))
            //        $(el).get(0).pause();
            //    $(el).parent().removeClass("intro");
            //});
            _this.parent().addClass("intro");
          });
});

Answer 1

play event不会冒泡，所以你不能使用事件委托(delegate)。将元素添加到 dom 后，您需要绑定(bind)处理程序，因此

function AddMoreContent() {
    $.ajax({
        url: thisPage + "/" + thisPage + "." + scrollCount + ".html",
        context: document.body,
        success: function (response) {
            var $els  = $(response);
            $("#main-content").append($els);
            //use .filter if the audio elements are in the root level of response
            $els.find("audio").on('play', function () {
                //do your stuff
            });
            scrollCount++;
        }
    });
}