Question

大家好，我希望你能帮我解决这个问题...

我动态地从XML文件插入Collapsible集。当可折叠集的一个元素打开时，您可以启动一个轨道。但是，当打开另一个元素并关闭旧元素时，轨道仍会播放。有没有办法暂停或只是停止播放器播放曲目？

我使用此脚本在Collapsible集中插入XML数据。

<script type="text/javascript">
    $(document).ready(function () {
        $.ajax({
            type: "GET",
            url: "arheologija.xml",
            dataType: "xml",
            success: function (xml) {

                var container = document.getElementById("catalogue");
                container.setAttribute('data-role', 'collapsible-set');

                $(xml).find('artifakt').each(function () {
                    var release = document.createElement("div");
                    release.setAttribute('data-role', 'collapsible');
                    var cat = $(this).find('slika').text();
                    var title = $(this).find('ime').text();
                    var artist = $(this).find('posnetek').text();
                    var tracks = "";
                    var player = "<audio preload=&quotnone&quot><source src=&quotmiles.mp3&quot></audio>"

                    $(this).find('ime').each(function () {
                        tracks = tracks + $(this).find('ime').text() + "<br>";
                    });
                    release.innerHTML = "<h3>" + title + "<br>" + cat + "</h3><p>" + cat + "</p><audio controls><source src='" + artist + "'></audio>";
                    container.appendChild(release);

                });
                $('#ranking1').replaceWith('<div id="ranking1" data-role="collapsible" data-collapsed="false"></div>');
                var catDiv = $('#catalogue');
                catDiv.find('div[data-role=collapsible]').collapsible({
                    theme: 'c',
                    refresh: false
                });
            }
        });
    });
</script>

Answer 1

您只需听取expand （jQM 1.3） / collapsibleexpand （jQM 1.4）事件。

$(document).on("collapsibleexpand", function (e) {
  $("audio").each(function () {
    $(this)[0].pause();
  });
});

<强> Demo

jQuery Mobile可折叠集 - 当元素关闭时停止音频播放器

1 个答案: