Jquery - 计算表单中空元素的数量

时间:2014-11-10 10:10:59

标签: jquery html forms count

我有一个像这样的Bootstrap 3表单,我想使用JQuery来计算没有值或没有选择的元素数量(单选按钮,复选框和选择)

<div class="form-group required">
    <label class="control-label">Field 1</label>
    <div>
        <input type="text" name="field1" class="form-control">
    </div>
</div>
<div class="form-group required">
    <label class="control-label">Field 2</label>
    <div>
        <input type="text" name="field2" class="form-control">
    </div>
</div>
<div class="form-group required">
    <label class="control-label">Field 3</label>
    <div>
        <input type="radio" class="" name="field3" value="0"> No
        <input type="radio" class="" name="field3" value="1"> Yes
    </div>
</div>
<div class="form-group">
    <label class="control-label">Field 4</label>
    <div>
        <input type="checkbox" class="" name="field3" value="1"> Yes
    </div>
</div>
<div class="form-group required">
    <label class="control-label>Gield 5</label>
    <div>
        <select class="form-control">
            <option value=""></option>
            <option value="1">1</option>
            <option value="23">2</option>
        </select>
    </div>
</div>

我有这个JQuery,它会在一分钟内计算所有没有值的文本输入。这有效但我刚刚意识到单选按钮的值和复选框一样。

$(document).ready(function() {

    function animateProgress() {

        count = $('#createPartForm .form-control').filter(function(){
                        return !$(this).val();
                }).length;

        /*var radios_length  = $('#createPartForm input[type=radio]').length;

        if(radios_length > 0 ) {
            //count = (count - radios_length) +1
        }

        console.log(count);*/

        var test = 20 - ((20 / fields) * count);

        $(bar).attr('aria-valuenow', aria + test);

        var bar_width = $(bar).attr('aria-valuenow');
        $(bar).width(bar_width + '%');
        $('.progress-completed').text(bar_width + '%');
    }

    var fields = $('.control-label').length;
    var bar = $('.progress-bar');
    var aria =  $(bar).data('arianow');

    animateProgress();

    $('.form-control').focusout(function() {
        animateProgress();
    }); 
});

这段代码计算所有空值,不计算收音机,复选框或选择。我如何调整它以便计算所有输入,但只将单选按钮组计为一个元素?

count = $('#createPartForm .form-control').filter(function(){
            return !$(this).val();
        }).length;

1 个答案:

答案 0 :(得分:0)

我不确定我是否理解您的要求。但$( "input[type=radio]" )将获得所有单选按钮。然后,您可以使用.is(":selected")进行过滤,以查找所有选定的单选按钮。未选中的计数将全部选中