音乐播放器冻结页面，所有浏览器

Question

我在this test page 上有一个音乐播放器。调用的外部 JavaScript 文件可以通过 head 标签内的页面源来查看。他们是

/js/jquery-1.6.1min.js

/js/myplaylist.js

/plugin/ttw-music-player.js （放置复选框的脚本在这个文件中）

我还包含两个内部 JavaScript 部分：

<script type="text/javascript">
$(document).ready(function() {
    var description = '<p align="center">Classic and Southern Rock<br /><i>Check the songs you want, then click the first title checked to begin playing.</p></i><br /><input type="button" onclick="uncheckAll()" value="Clear"/><input class="check" type="button" onclick="checkAll()" value="Select All"/>';

    $('#yipPlayer').ttwMusicPlayer(myPlaylist, {
        autoPlay: false,
        description: description,
        jPlayer: {
            swfPath: 'plugin/jquery-jplayer'
        }
    });
});
</script>

这个位用于清除/选择复选框：

<script>
function uncheckAll() {
    $("input[type='checkbox']:checked").prop("checked", false)
}

function checkAll() {
    $("input[type='checkbox']").prop("checked", true)
}
</script> 

注意事项：在添加复选框之前，只需单击标题，播放器的行为就是继续浏览整个歌曲列表，除非手动暂停。添加复选框后，播放器会加载所有选中的复选框。必须清除所有框，然后检查歌曲选择。单击第一个选定的标题，然后启动播放器。播放器将顺利播放所有检查过的歌曲，直到到达最后一首歌曲的结尾；然后它将重新开始。如果您不希望它继续重复播放列表，则必须取消选中这些框。即使只检查了一首歌曲，它也会一遍又一遍地重复那首歌曲。要停止重复，您必须取消选中该框。 （可以通过单击提供的播放器链接来测试播放器的行为。您可以拖到一首歌曲的末尾，以避免必须完整地坐下来。）

当所有复选框都未选中时会出现问题。如果允许播放器一直播放到歌曲的结尾，页面将冻结。只要歌曲正在播放，就可以暂停它，选中/取消选中复选框等。只有当没有选中任何复选框并且歌曲完全播放到结束时才会发生冻结。发生这种情况时，页面不再响应任何点击。一个人只能关闭页面标签（在大多数情况下）。

无论浏览器如何（在 Firefox、Chrome、Safari、Opera 中测试），都会发生这种情况。 Firefox 确实给出了包含此信息的“无响应脚本”警报：

脚本：http://yipcabbage.com/playerTest/js/jquery-1.6.1.min.js:16（为什么 :16 出现在该链接的末尾？当然，它会给出 404 错误。）

我缺乏调试 JavaScript 的技能。由于脚本错误指向jquery-1.6.1.min.js，所以我通读了this page，但不明白checkboxes的属性和属性。

我的问题是，由于播放器最初加载时选中了所有框，它是否冻结是因为它最初设置为播放播放器中列出的所有歌曲并且取消选中复选框会破坏该功能（因此它“确实'不知道该做什么'当一首歌到达结尾并且没有任何检查时）？

Answer 1

问题仅在于根本没有选中复选框。

来自/plugin/ttw-music-player.js里面的这个函数：

function playlistNext() {
    $cbs = $(".cb");
    var index = current;
    do {
        index = (index + 1 < myPlaylist.length) ? index + 1 : 0;
    } while (!$cbs.eq(index).prop("checked"));
    playlistAdvance(index);
}

它进入一个无限循环，因为没有任何复选框与 $cbs.eq(index).prop("checked") 条件匹配。

您可以考虑始终选中一个复选框。或者通过检查是否有任何框被选中来修复该功能。