Question

预先感谢忍者。这让我发疯。我找不到如何遍历并从表单提交中获取所有选中的复选框的方法。它仅检索一个值。

jQuery

    var price_range = jQuery(".et_pb input[type=checkbox]:checked").val();

HTML

                        <span class="et_pb">
                        <span class="field_options_title">Desired Price Range</span>

                        <input type="checkbox" id="price_range_12_0" class="input" value="Under $200,000" data-id="">
                        <label for="price_range_12_0"><i></i>Under $200,000</label>


                        <input type="checkbox" id="price_range_12_1" class="input" value="$200,000 - $300,000" data-id="">
                        <label for="price_range_12_1"><i></i>$200,000 - $300,000</label>


                        <input type="checkbox" id="price_range_12_2" class="input" value="$300,000 - $400,000" data-id="">
                        <label for="price_range_12_2"><i></i>$300,000 - $400,000</label>


                        <input type="checkbox" id="price_range_12_3" class="input" value="$400,000 - $500,000" data-id="">
                        <label for="price_range_12_3"><i></i>$400,000 - $500,000</label>

                        <input type="checkbox" id="price_range_12_4" class="input" value="$500,000+" data-id="">
                        <label for="price_range_12_4"><i></i>$500,000+</label>
                    </span>

Answer 1

如果仅对值感兴趣，可以使用jQuery.map()：

 import TimeRangeConverter from './TimeRangeConverter';

var price_range = jQuery(".et_pb input[type=checkbox]:checked").map(function(idx, ele) {
    return ele.value.indexOf('500') > -1 ? '4' : ele.value;
}).get();


console.log(price_range);

Answer 2

使用.each()获取所有值

$(document).ready(function(){
var a=[];
$('input').change(function(){

$("input:checkbox:checked").each(function(){
    a.push($(this).val());
    console.log(a)
});
})



})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span class="et_pb">
                        <span class="field_options_title">Desired Price Range</span>

                        <input type="checkbox" id="price_range_12_0" class="input" value="Under $200,000" data-id="">
                        <label for="price_range_12_0"><i></i>Under $200,000</label>


                        <input type="checkbox" id="price_range_12_1" class="input" value="$200,000 - $300,000" data-id="">
                        <label for="price_range_12_1"><i></i>$200,000 - $300,000</label>


                        <input type="checkbox" id="price_range_12_2" class="input" value="$300,000 - $400,000" data-id="">
                        <label for="price_range_12_2"><i></i>$300,000 - $400,000</label>


                        <input type="checkbox" id="price_range_12_3" class="input" value="$400,000 - $500,000" data-id="">
                        <label for="price_range_12_3"><i></i>$400,000 - $500,000</label>

                        <input type="checkbox" id="price_range_12_4" class="input" value="$500,000+" data-id="">
                        <label for="price_range_12_4"><i></i>$500,000+</label>
                    </span>

Answer 3

[col setWidth:1000];
[col setMinWidth:1000];
[col setMaxWidth:1000];

jQuery在表单提交中获取所有选中的复选框值

3 个答案: