数组推送更改格式 jQuery

array push change format jquery

本文关键字:格式 jQuery 数组      更新时间:2023-09-26
var student = $('#student tr').find('td').find('input[type='"text'"]');
    student.each(function(index, element) {
      var label = $(element).parent().find('span').text();
      var member = $('#student').attr('name');
      studentnames.push({
        value: $(element).val(),
        label: label,
        member: member
      });
    });

这就是我制作数组的方式。这是输出

[{
    "value": "jackie",
    "label": "First Name",
    "member": "science club"
}, {
    "value": "chan",
    "label": "Middle Name",
    "member": "science club"
}, {
    "value": "lee",
    "label": "Last Name",
    "member": "science club"
}, {
    "value": "jr",
    "label": "Suffix",
    "member": "science club"
}, {
    "value": "Tokyo",
    "label": "City/Province",
    "member": "science club"
}, {
    "value": "Nanporo",
    "label": "Town/Municipality",
    "member": "science club"
}, {
    "value": "Sorachi",
    "label": "District",
    "member": "science club"
}, {
    "value": "1234",
    "label": "Contact Number",
    "member": "science club"
}]

如何将其更改为类似格式

[{
    "First Name": "jackie",
    "Middle Name": "chan",
    "Last Name": "lee",
    "Suffix": "jr",
    "City/Province": "Tokyo",
    "Town/Municipality": "Nanporo",
    "District": "Sorachi",
    "member": "science club"
}]

我的 HTML 表格是这样的

<table id="student" name="student" class="student">
    <tr>
        <td>
            <center>
                <input type="text" name="fname" class="fname" />
                <br> <span><small><i>First Name</i></small></span> </center>
        </td>
        <td>
            <center>
                <input type="text" name="mname" class="mname" />
                <br> <span><small><i>Middle Name</i></small></span> </center>
        </td>
        <td>
            <center>
                <input type="text" name="lname" class="lname" />
                <br> <span><small><i>Last Name</i></small></span> </center>
        </td>
    </tr>
    <tr>
        <td>
            <center>
                <input type="text" name="suffix" class="suffix" />
                <br> <span><small><i>Suffix</i></small></span> </center>
        </td>
    </tr>
    <tr>
        <td>
            <center>
                <input type="text" name="city" class="city" />
                <br> <span><small><i>City/Province</i></small></span> </center>
        </td>
        <td>
            <center>
                <input type="text" name="town" class="town" />
                <br> <span><small><i>Town/Municipality</i></small></span> </center>
        </td>
        <td>
            <center>
                <input type="text" name="district" class="district" />
                <br> <span><small><i>District</i></small></span> </center>
        </td>
    </tr>
    <tr>
        <td>
            <center>
                <input type="text" name="contact" class="contact" />
                <br> <span><small><i>Contact Number</i></small></span> </center>
        </td>
    </tr>
    <tr>
        <td>
            <input type="button" id="addtable" value="Add" name="" /> </td>
        <td>
            <input type="button" id="removetable" value="Remove" name="" /> </td>
    </tr>
</table>

"添加和删除"按钮具有一个 jQuery 函数,可根据用户单击添加或删除相同的表

var studentnames = [];
$('#checkConsole').click(function() {
    var student = $('#student tr').find('td').find('input[type='"text'"]');
    var temp = {};
    student.each(function(index, element) {
        var label = $(element).parent().find('span').text();
        var member = $('#student').attr('name');
        temp[label] = $(element).val();
        temp['member'] = member;
    });
    studentnames.push(temp);
    console.log(studentnames);
});

杰斯菲德尔

我们可以使用 [] 来获取/设置对象属性。

例如:

var obj = {}, key = "property1", value = "testValue";
obj[key] = value;
obj["key with space"] = "the value";
console.log(JSON.stringify(obj)); //{"property1":"testValue","key with space":"the value"}

我修改了你的代码:http://jsfiddle.net/gtkLmgd9/

这是一个

您可以尝试的简单示例:

<center>标记在 HTML5 中不受支持。请改用 CSS。

//so the center tag you may change to another tag
var td = $('#student tr').find('center'),
arr = {};
td.each( function() {
   var label = $(this).find('i').text();
   var val = $(this).find("input[type='text']").val();
   arr[label] = val;
});

演示