0

我正在将我的 Jplayer 代码嵌入到我的网站中,但是 wordpress 安装中已经有 jquery,但是当我将代码复制到播放器上时,它会损坏,因为它没有显示带有 x 的音量图标。当我包含一个外部 jquery 脚本时,它会破坏入口站点,但播放器可以工作。有没有更好的方法让我将 jPlayer 包含到我的 wordpress 网站中?

4

1 回答 1

1

jPlayer 脚本入队必须按照 WordPress 规则播放。最简单(也许是唯一)的方法是使用Shortcode。有很多开发人员,主要是主题开发人员,忽略了我们不会将捆绑的 jQuery 版本出列并从某个 CDN 加载任何版本(至少,我们不会在不知道我们在做什么的情况下这样做)。

这是一个粗略的测试,短代码回调函数需要大量打磨。

public function plugin_setup() // hooked into plugins_loaded 
{
    add_action( 'wp_enqueue_scripts', array( $this, 'enqueue' ) );
    add_shortcode( 'jplayer', array( $this, 'shortcode' ) );
}

public function enqueue()
{
    wp_register_script(
        'sj-jplayer', 
        $this->plugin_url . 'js/jquery.jplayer.min.js', 
        array( 'jquery' ), // <------- Dependencies
        false,
        true
    );
    wp_register_style( 'sj-skin', $this->plugin_url . 'skin/blue.monday/jplayer.blue.monday.css' );

    wp_enqueue_script( 'sj-jplayer' );
    wp_enqueue_style( 'sj-skin' );
}

public function shortcode( $atts, $content )
{
    ob_start();
    require_once('html-shortcode.php');
    $var = ob_get_clean();
    return $var;
}

该文件html-shortcode基本上是这个演示代码改编如下:

<?php
/*
 * Prints the shortcode
 */
?>
<script type="text/javascript">
    jQuery(document).ready(function($) // <------ WP noConflict 
    {
        $("#jquery_jplayer_1").jPlayer({});
    });
</script>

<div id="jquery_jplayer_1" class="jp-jplayer"></div>

我在另一个执行jScrollPane的 jPlayer 短代码中测试了这个 jPlayer 短代码,它可以在 iPad 上运行。

于 2013-10-15T19:14:38.670 回答