Question

我尝试在音频play事件上执行一个函数：

jQuery('audio').on('play', function () { /* ... */ });

但是在执行此功能时我的元素不存在，所以它没有被选中。相反，当我需要触发动态添加内容的事件时，我习惯使用不同的语法：

jQuery('.constant-container').on('play', 'audio', function () {
    /* ... */ 
});

.constant-container不变的地方。但是这个解决方案似乎不起作用，音频元素也没有得到任何click事件。

这是link to the bin。

前4个音频正确处理事件，但不是最后4个。

Answer 1

显然媒体事件（特别属于音频或视频的事件，如play，pause，timeupdate等）不要冒泡。你可以在this question的答案中找到相关的解释。

因此，使用他们的解决方案，我捕获了play事件，

jQuery.createEventCapturing(['play']);  
jQuery('body').on('play', 'audio', function(){... // now this would work.

JS Bin demo

事件捕获代码（取自其他SO答案）：

    jQuery.createEventCapturing = (function () {
        var special = jQuery.event.special;
        return function (names) {
            if (!document.addEventListener) {
                return;
            }
            if (typeof names == 'string') {
                names = [names];
            }
            jQuery.each(names, function (i, name) {
                var handler = function (e) {
                    e = jQuery.event.fix(e);

                    return jQuery.event.dispatch.call(this, e);
                };
                special[name] = special[name] || {};
                if (special[name].setup || special[name].teardown) {
                    return;
                }
                jQuery.extend(special[name], {
                    setup: function () {
                        this.addEventListener(name, handler, true);
                    },
                    teardown: function () {
                        this.removeEventListener(name, handler, true);
                    }
                });
            });
        };
    })();

音频事件不会在播放事件上触发jquery

1 个答案:

JS Bin demo