Question

我正在尝试按下一个按钮，将另一个视频替换为自动播放和循环播放。

真的无法解决这个问题，任何帮助都会很棒！

继承我的代码，

 <div data-role="page">

    <div data-role="header">
        <h1>Live Fire</h1>
    </div><!-- /header -->

    <div data-role="content">
        <button>Clicky</button>
        <br>
        <video id="container" width="600" height="400" src="video/1.mp4" type="video/mp4" autoplay="autoplay" loop="loop"></video>

    </div><!-- /content    -->

    <div data-role="footer" data-position="fixed" class="ui-bar">
    <a href="#" data-icon="plus">Add</a>

</div>
</div><!-- /page -->
<script>
    $('button').on('click', function () {
    var $el = $(this).data('toggle') ? '<video id="container" width="600" height="400" src="video/1.mp4" type="video/mp4" autoplay="autoplay" loop="loop"></video>' : '<video id="container" width="600" height="400" src="video/3.mp4" type="video/mp4" autoplay="autoplay" loop="loop"></video>';
    $(this).data('toggle', !$(this).data('toggle'));
    $('#container').html($el);
});
    </script>
</body>

Answer 1

toggle()不再像你认为的那样在jQuery 1.9之后运行，它已被动画方法取代。

以下是jQuery 1.9.1的一种方法：

$('button').on('click', function () {
    var $el = $(this).data('toggle') ? VIDEO_1 : VIDEO_2;
    $(this).data('toggle', !$(this).data('toggle'));
    $('#container').html($el);
});

FIDDLE

在点击时切换视频

1 个答案: