Question

我想迭代一个动态创建的选择和输入字段。我的HTML代码：

 <div id="speeddefinition">
<div class="row speedline">
    <div class="col-md-4">
    <div class='input-group ' id=''>
        <select class="form-control firstentry" name="line[]" >
            <option value="1">Anlage 1</option> 
            <option value="2">Anlage 2</option> 
            <option value="3">Anlage 3</option> 
            <option value="4">Anlage 4</option> 
        </select>
    </div>
    </div>
    <div class="col-md-3">
    <div class='input-group ' id=''>
    <input name="speed[]" value="" class="form-control firstentry"  type="text" ></input>
    </div>
    </div>
</div>
</div>

我的Jquery：

function createJSON() {
    var values = [];
    $("#speeddefinition").each(function() {
        $(this).find("input, select").each(function() {
            values.push($(this).val());
        });
    });
    var valJson = JSON.stringify(values);
    console.log(valJson);
}

输出就像：["2","5","3","4"]

我已经尝试了各种各样的东西，但我无法达到这样的结果：

{
    "1": {
        "line": 2,
        "speed": 5,
    }
    "2": {
        "line": 3,
        "speed": 4,
    }
}

Answer 1

元素的ID必须是唯一的，因此如果结构重复，则<div id="speeddefinition">使用<div class="speeddefinition">而不是

然后

var obj = {};
$('.speeddefinition').each(function (i) {
    var $this = $(this);
    obj[i] = {
        speed: $this.find('input').val(),
        line: $this.find('select').val()
    }
})
console.log(obj)

Answer 2

function createJSON() {
var values = [];
var innerValues = new Array() ;

$("#speeddefinition").each(function() {//it should not be an id

$(".speeddefinition").each(function() { //it should be a class

    $(this).find("input").each(function() {
        innerValues['line'] = $(this).val(); 
    });

     $(this).find("select").each(function() {
        innerValues['speed'] = $(this).val(); 
    });

    values.push(innerValues);
});

var valJson = JSON.stringify(values);
console.log(valJson);
}

可能是这个功能会帮助你......

Answer 3

这样的事情会起作用：

$('.speeddefinition').map(function() {
    return {line: $('select', this).val(), speed: $('input', this).val()};
}).get();

将给你想要的数组：

[{line: "1", speed: "1"}, {line: "2", speed: "2"}]

注意：.speeddefinition是一个类，而不是id。

在jquery中迭代class的元素并放入json格式

3 个答案: