Question

我尝试使用3个单选按钮控制JPlayer的单个实例，因此如果选中一个按钮，它将开始播放，而未选中的流将停止播放。当页面加载时，第一个流开始播放，但如果我检查其他2个按钮中的一个，则第一个流不会改变。可能是什么问题？

我的代码如下：

<div id="radiobox">
        <div class="cc-selector">
            <input checked="checked" id="blue" type="radio" name="rtype" value="blue" />
            <label class="radio-cc blue" for="blue"></label>
            <input id="orange" type="radio" name="rtype" value="orange" />
            <label class="radio-cc orange"for="orange"></label>
            <input id="purple" type="radio" name="rtype" value="purple" />
            <label class="radio-cc purple"for="purple"></label>
        </div>
</div>

这些是按钮：

<div id="jquery_jplayer_1" class="jp-jplayer"></div>
        <div id="jp_container_1" class="jp-audio-stream">
            <div class="label"></div>
                <div class="jp-type-single">
                    <div class="jp-gui jp-interface">
                        <ul class="jp-controls">
                            <li><a href="javascript:;" class="jp-play" tabindex="1" id="playBtn"></a></li>
                            <li><a href="javascript:;" class="jp-pause" tabindex="1"id="stopBtn"></a></li>
                        </ul>
                    </div>
                </div>
        </div>

这是玩家：

cities.txt

Answer 1

此代码在加载页面时触发一次。单击复选框时，没有触发代码。您需要https://api.jquery.com/click/的jquery点击事件。

如果您只想更改单选按钮检查中的媒体元素，则再次指定所有选项是没有意义的。

如果您只有一个jPlayer实例（如上面的代码所示），那么您就不需要＆＃39; pauseOthers＆＃39; func要么。

$("input#blue").click(function(){
streamSrc = "http://s6.voscast.com:10522/;stream/1";

//Makes sure we don't set media again if already set to the correct one
if ($("#jquery_jplayer_1").data().jPlayer.status.src != streamSrc)
{
        $("#jquery_jplayer_1").jPlayer("setMedia", {mp3: streamSrc}).jPlayer("play");
}   
});

$("input#orange").click(function(){
streamSrc = "http://stream.tilos.hu/tilos_32.mp3";

//Makes sure we don't set media again if already set to the correct one
if ($("#jquery_jplayer_1").data().jPlayer.status.src != streamSrc)
{
        $("#jquery_jplayer_1").jPlayer("setMedia", {mp3: streamSrc}).jPlayer("play");
}   
});

$("input#purple").click(function(){
streamSrc = "http://mr-stream.mediaconnect.hu/4738/mr2.mp3";

//Makes sure we don't set media again if already set to the correct one
if ($("#jquery_jplayer_1").data().jPlayer.status.src != streamSrc)
{
        $("#jquery_jplayer_1").jPlayer("setMedia", {mp3: streamSrc}).jPlayer("play");
}   
});

http://jsfiddle.net/chq6uu16/18/

JPlayer流与单选按钮问题

1 个答案: