JavaScript 全选按钮不起作用

Question

我的音乐播放器(测试站点)上有一个小脚本，应该允许用户取消选中(清除)所有复选框或全部选中(全选)。玩家位于HERE 。这是我的内部 JavaScript:

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

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

我的输入:

<input type="button" onclick="uncheckAll()" value="Clear"/><input class="check" type="button" onclick="checkAll()" value="Select All"/>

“清除”按钮功能良好。 “全选”按钮不起作用。

我想知道问题是否出在我的内部 JavaScript 上，或者是否与玩家的自然默认设置是在选中所有框的情况下打开这一事实有关？ (“全选”按钮的目的只是，如果用户决定听所有歌曲，而不是选择一些歌曲，则将检查返回到其自然位置。我意识到用户可以刷新页面，但是我认为“全选”按钮会更加用户友好。

(播放器的 JavaScript，ttw-music-player.js，在页面源的 head 标记内有其位置链接。)处理复选框的部分是:

        markup = {
            listItem:'<li class="track">' +
                        '<span class="title"></span>' +
                        '<span class="duration"></span>' +
                        '<span class="rating"></span>' +
                        '<a href="#" class="buy not-active" target="_blank"></a>' +
                        '<input class="cb" type="checkbox" checked="true">' +
                    '</li>',
            ratingBar:'<span class="rating-level rating-bar"></span>'
        };

和

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

谁能帮我确定为什么全选 (checkAll) 功能不起作用，而清除 (uncheckAll) 功能却起作用？

Answer 1

尝试这样使用:

function uncheckAll() {
   $("input:checkbox").prop("checked", false)
}

function checkAll() {
   $("input:checkbox").prop("checked", true)
}

function uncheckAll() {
    $("input:checkbox").prop("checked", false)
}

function checkAll() {
    $("input:checkbox").prop("checked", true)
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ol class="tracks">
  <li><input type="checkbox"></li>
  <li><input type="checkbox"></li>
  <li><input type="checkbox"></li>
  <li><input type="checkbox"></li>
  <li><input type="checkbox"></li>
  <li><input type="checkbox"></li>
</ol>

<input type="button" onclick="uncheckAll()" value="Clear"/><input class="check" type="button" onclick="checkAll()" value="Select All"/>

希望它对你有用:)