0

我正在对使用audio.js作为音频播放器的网站进行故障排除。我正在尝试使用 click 方法配置音频播放器的事件回调，但它无法识别我的点击。然而，它确实像在这个jsfiddle上一样工作。任何帮助是极大的赞赏

我所做的 - 消除了所有 CSS 和不相关的脚本。Click 方法适用于 audiojs 类之前和之后的 div。

我用于音频播放器的简码 -

// audio player
add_shortcode( 'sp_audio', 'sp_audio_shortcode' );
function sp_audio_shortcode( $atts, $contents = null ) 
{
    extract( shortcode_atts( array(
        'id' => 'sp-audio-player',
        'url' => '',
        ),
        $atts ) );


    $output .= '<audio preload="none">';
        $output .= '<source src="' . $url . '" type="audio/mpeg">';
    $output .= '</audio>';

    return $output;
}

Chrome 的检查元素中的输出

<div class="musicplayer">
<div class="audiojs" classname="audiojs" id="audiojs_wrapper5">
    <audio preload="none">
        <source src="http://soundtrackloops.com/Demo/Electronisounds-AcousticBarefootBeats-DEMO.mp3" type="audio/mpeg">
    </audio>          
    <div class="play-pause">             
        <p class="play"></p>             
        <p class="pause"></p>             
        <p class="loading"></p>             
        <p class="error"></p>          
    </div>           
    <div class="scrubber">             
        <div class="progress"></div>             
        <div class="loaded"></div>           
    </div>           
    <div class="time">             
        <em class="played">00:00</em>/<strong class="duration">00:00</strong>           
    </div>           
    <div class="error-message"></div>
</div>

我的测试点击方法

jQuery(document).ready(function($) {  

$( ".audiojs" ).click(function() {
  alert( "CLICK" );
});

初始化音频.js

audiojs.events.ready(function() {
    audiojs.createAll();
});
4

2 回答 2

0

我有一个类似的问题，并通过在音频对象上使用事件侦听器来解决它。我想这取决于您要跟踪的内容，但这可以让您控制播放和停止等。

我修改了我的代码，所以它应该可以与你的代码一起使用

audiojs.events.ready(function() {
var as = audiojs.createAll();

$(".audiojs audio").on('playing',function(){
    console.log("Push playing");
});

    // Other callbacks
});

希望你让它工作。我每页只有一个播放器，如果您有更多播放器，只需在回调中使用 $(this) 元素来识别已更改的播放器。

于 2013-12-21T22:54:08.383 回答
0

看起来您在页面加载后附加了音轨，因此您需要使用实时点击事件。

尝试这个：

jQuery(document).ready(function($) {  

$('.audiojs').live('click', function() {
  alert( "CLICK" );
});
于 2013-08-21T20:25:52.947 回答