JQM 翻转拨动开关播放停止音频

Question

我在 jQuery Mobile 中使用 Flipswitch 小部件，希望在开关打开时播放音频文件，在开关关闭时停止。

我的HTML代码：

<audio id="soundtrack">
  <source src="Sounds/soundtheme.ogg" type="audio/ogg">
  <source src="Sounds/soundtheme.mp3" type="audio/mp3">
  Your browser does not support the audio element.
</audio>

    <form>
    <label for="flip-select-audio">AUDIO:</label>
    <select id="flip-select-audio" name="flip-select-audio" data-role="flipswitch">
        <option value="off">OFF</option>
        <option value="on">ON</option>
    </select>
</form>

我想弄明白 JS 代码是怎样的

$('#flip-select-audio').change(function() {

...

});

Answer 1

您可以尝试这样的操作：

$('#flip-select-audio').change(function() {
    var soundtrack = $("#soundtrack")[0];
    if ($(this).val() == "on") {
        soundtrack.play();
    } else {
        soundtrack.pause();
        soundtrack.currentTime = 0;
    }

});

更新 : 在这里工作完美 https://jsfiddle.net/q3Lw8c4g/1/ 你应该检查你的声音文件是否可读。

JQM 翻转拨动开关播放停止音频

JQM Flip Toggle Switch play stop audio

mobile

jquery

toggle

switch-statement

flip