Блог

У меня есть таблица флажков, в которой я хочу проверить, установлен ли хотя бы один из них. Я написал небольшую функцию для перебора всех флажков с определенным именем и проверки проверяемого свойства, но мой код никогда не улавливает сценарий, в котором флажки не установлены.

Определение таблицы

 <div id="testTable">
    <table class="table table-striped">
        <caption></caption>
        <thead>
            <tr>
                <th>Test</th>
                <th>Description</th>
            </tr>
        </thead>
        <tr>
            <td>
                <input type="checkbox" id="testA" name="test" title="Run TestA" />
                <label for="testA">TestA</label>
            </td>
            <td>Description of TestA</td>
        </tr>
        <tr>
            <td>
                <input type="checkbox" id="testB" name="test" title="Run TestB" />
                <label for="testB">TestB</label>
            </td>
            <td>Description of TestB</td>
        </tr>
    </table>
</div>
 

Кнопка проверки

 <div class="row">
    <div class="form-group">
        <span class="input-group-btn">
            <button class="btn btn-default" type="button" id="btnRunTests">Run selected test(s)</button>
        </span>
    </div>
</div>
 

Скрипт

 <script type="text/javascript">
    $(document).ready(function () {
        $('#btnRunTests').click(function ()
        {
            if (!anyTestsChecked)
            {
                $('#divAlertMain').html('<div id="divAlert" class="alert alert-danger"><button type="button" class="close" data-dismiss="alert">x</button>You must select at least one test to run.</div>');
            }
            else
            {
                $('#divAlertMain').html('<div id="divAlert" class="alert alert-danger"><button type="button" class="close" data-dismiss="alert">x</button>Good job!</div>');
            }
            window.setTimeout(function () {
                $('#divAlert').hide('slow');
            }, 10000);
        });
    });

    function anyTestsChecked()
    {
        var chk = document.getElementsByName('test');
        var len = chk.length;

        var foundChecked = false;
        var i = 0;
        while (i < len amp;amp; !foundChecked)
        {
            if (chk[i].type === 'checkbox' amp;amp; chk[i].checked)
            {
                foundChecked = true;
            }
            i  ;
        }

        return foundChecked;
    }
</script>
 

Вы можете добиться того же, используя приведенный ниже код. (Для этого не нужно писать дополнительную функцию)

 <script type="text/javascript">
    $(document).ready(function () {
        $('#btnRunTests').click(function () {
            if ($("input[name='test']").prop('checked') == false) {
                $('#divAlertMain').html('<div id="divAlert" class="alert alert-danger"><button type="button" class="close" data-dismiss="alert">x</button>You must select at least one test to run.</div>');
            }
            else {
                $('#divAlertMain').html('<div id="divAlert" class="alert alert-danger"><button type="button" class="close" data-dismiss="alert">x</button>Good job!</div>');
            }
            window.setTimeout(function () {
                $('#divAlert').hide('slow');
            }, 10000);
        });
    });
</script>
 

Ваша функция anyTestsChecked никогда не запускается. Вы просто проверяете, существует ли он. Добавьте () в конец вызова вашей функции в операторе if.

 if (!anyTestsChecked())