javascript - 根据选择隐藏/取消隐藏按钮

Question

我正在开发这个脚本，人们可以选择并按下一步来呈现另一组步骤。我有一个提交按钮可以转到下一步，我需要默认禁用它，并且仅当选择包含另外 2 个选择时才启用。

可以在这里找到 JSFiddle:http://jsfiddle.net/fhu95/

这是我的代码:

JS:

    var selections = {
    "Television": false,
    "Internet": false,
    "Telephony": false,
    "Mobile": false,
    "opt5": false,
    "opt6": false,
    "opt7": false
};

$(document).ready(function() {
    $('.option').click(function(event) {
        var id = event.target.id;
        if (selections[id]) {
            $('#' + id).removeClass('checked-option');
            selections[id] = false;
        } else {
            $('#' + id).addClass('checked-option');
            selections[id] = true;
        }
    });




    $('#btn1').click(function() {
        $('#grp1').hide();
        $('#grp2').show();
    });

按钮的 HTML:

<div class="btn"><button id="btn1">Next</button></div>

Answer 1

记录当前选中选项的计数，并在每次单击选项后使用它来启用或禁用按钮。
在这里 fiddle :http://jsfiddle.net/Jtz8A/1/

var count = 0;
$(document).ready(function() {
    $('#btn1').prop('disabled', true); // Disable button on load
    $('.option').click(function(event) {
        var id = event.target.id;
        if (selections[id]) {
            $('#' + id).removeClass('checked-option');
            selections[id] = false;
            count--; // Keep count
        } else {
            $('#' + id).addClass('checked-option');
            selections[id] = true;
            count++; // Keep count
        }
        if(count > 1) // Use count to enable or disable button
           $('#btn1').prop('disabled', false);
        else
           $('#btn1').prop('disabled', true);
    });