如何使用键和值格式化jQuery .map()?

时间:2018-07-13 12:17:18

标签: javascript jquery

我尝试通过使用jQuery .map()使用键和值创建数组。 使用代码时,我在格式化方面遇到问题:

["name1:1", "name2:1", "name3:0"]

我需要:

['name1':1,'name2':1,'name3':0]

我花了几个小时使它工作,但我不知道出什么问题了。

HTML

<div class="inputs-container">
    <input id="name1" name="name1" type="checkbox" class="multicheckbox-item" value="1" checked="checked">
    <input id="name2" name="name2" type="checkbox" class="multicheckbox-item" value="1" checked="checked">
    <input id="name3" name="name3" type="checkbox" class="multicheckbox-item" value="0">
</div>

JS

var inputsContainer = $('.inputs-container');

var inputValues = inputsContainer.find( 'input.multicheckbox-item' ).map( function() {
    var name = $(this).attr('name');
    var active = 0;
    if( $(this).prop( 'checked' ) ){
        var active = 1;
    }
    return name + ':' + active;
}).get();

console.log( inputValues );

3 个答案:

答案 0 :(得分:3)

您需要一个对象和.each(或本机数组中的.forEach)。

var inputsContainer = $('.inputs-container');
var inputValues = {};

var inputValues = inputsContainer.find('input.multicheckbox-item').each( function() {
    inputValues[$(this).attr('name')] = ($(this).prop('checked') ? 1 : 0);
});

console.log(inputValues);

答案 1 :(得分:1)

尝试一下

var inputsContainer = $('.inputs-container');

var inputValues_key = inputsContainer.find( 'input.multicheckbox-item' ).map(function() {
    var name = $(this).attr('name');
    return name;
}).get();

var inputValues_value = inputsContainer.find( 'input.multicheckbox-item' ).map(function() {
    var active = $(this).prop('checked')? 1 : 0;
    return active;
}).get();


var inputValues = [], length = Math.min(inputValues_key.length, inputValues_value.length);
for(var i = 0; i < length; i++) {
    inputValues.push([inputValues_key[i], inputValues_value[i]]);
}
console.log( inputValues );

答案 2 :(得分:0)

可能您需要一个对象数组:

var inputsContainer = $('.inputs-container');

var inputValues = inputsContainer.find( 'input.multicheckbox-item' ).map( function(i) {
    var active = $(this).prop('checked')? 1 : 0;
    var temp = {}; i++;
    temp['name'+i] = active;
    return temp;
}).get();

console.log( inputValues );
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="inputs-container">
    <input id="name1" name="name1" type="checkbox" class="multicheckbox-item" value="1" checked="checked">
    <input id="name2" name="name2" type="checkbox" class="multicheckbox-item" value="1" checked="checked">
    <input id="name3" name="name3" type="checkbox" class="multicheckbox-item" value="0">
</div>