Question

我使用JavaScript从API请求信息（确切地说是VexDB）。信息采用以下格式：

[
    {
        "sku": "RE-VRC-17-4815",
        "key": "RE-VRC-17-4815",
        "program": "VRC",
        "name": "MCC VRC Skills Challenge",
        "loc_venue": "Manchester Community College",
        "loc_address1": "1066 Front Street",
        "loc_address2": "",
        "loc_city": "Manchester",
        "loc_region": "New Hampshire",
        "loc_postcode": "03102",
        "loc_country": "United States",
        "season": "In The Zone",
        "start": "2018-03-10T00:00:00+00:00",
        "end": "2018-03-10T23:59:59+00:00",
        "divisions": [
            "Division 1"
        ]
    },
    {
        "sku": "RE-VRC-17-4269",
        "key": "RE-VRC-17-4269",
        "program": "VRC",
        "name": "NH/VT 2018 VRC State Championship",
        "loc_venue": "Manchester Community College",
        "loc_address1": "1066 Front Street",
        "loc_address2": "",
        "loc_city": "Manchester",
        "loc_region": "New Hampshire",
        "loc_postcode": "03102",
        "loc_country": "United States",
        "season": "In The Zone",
        "start": "2018-02-17T00:00:00+00:00",
        "end": "2018-02-17T23:59:59+00:00",
        "divisions": [
            "Division 1"
        ]
    },
    {
        "sku": "RE-VRC-17-4051",
        "key": "RE-VRC-17-4051",
        "program": "VRC",
        "name": "RI Middle and High School VEX Robotics Competition",
        "loc_venue": "Scituate High School",
        "loc_address1": "94 Trimtown Rd",
        "loc_address2": "",
        "loc_city": "North Scituate",
        "loc_region": "Rhode Island",
        "loc_postcode": "02857",
        "loc_country": "United States",
        "season": "In The Zone",
        "start": "2018-02-10T00:00:00+00:00",
        "end": "2018-02-10T23:59:59+00:00",
        "divisions": [
            "Division 1"
        ]
    },
    ....
]

如何引用单独的项目，例如“sku”或“key”，因为它们有多个？（我对JavaScript的经验很少）

Answer 1

如果要将单个记录作为键/值对的JSON数组返回，则可以执行以下操作：

使用data[0].访问此记录集中返回的所需数据库列名称的值。

请记住，[0]是数组的第一个索引。这是因为我们不需要引用任何高于0的索引，因为我们只返回了1条记录。

＆＃13;

// CLICK EVENT (by ID)
$(document).on('click','#button_select_record', function(event) {

var data = [
               {
                  "PK_USER_ID":7000,
                  "USE_DTSTAMP":"2018-04-04 07:08:02",
                  "USE_USERNAME":"admin",
                  "USE_PASSWORD":"letmein",
                  "USE_LEVEL":"ADMIN",
                  "USE_STATUS":"SUSPENDED",
                  "USE_FIRST_NAME":"JOHN",
                  "USE_LAST_NAME":"DOE",
                  "USE_CELL":"555-111-1111",
                  "USE_HOME":"555-222-2222",
                  "USE_EMAIL":"john.doe@domain.com",
                  "USE_ADDRESS_1":"123 MAIN ST",
                  "USE_CITY":"WEST VALLEY",
                  "USE_STATE":"UT",
                  "USE_ZIP":"84128"
               }
            ]
                
	// If data is not '2' and its length is greater than 0...
	if (data.length > 0) {

	// CONVERT STR TO OBJ...
	//data = JSON.parse(data);

	// POPULATE FIELDS
	$('#PK_USER_ID').val(data[0].PK_USER_ID);
	$('#USE_DTSTAMP').val(data[0].USE_DTSTAMP);

	$('#USE_USERNAME').val(data[0].USE_USERNAME);
	$('#USE_PASSWORD').val(data[0].USE_PASSWORD);

	$('#USE_LEVEL  option[value="' + data[0].USE_LEVEL + '"]').prop("selected", true);
	$('#USE_STATUS  option[value="' + data[0].USE_STATUS + '"]').prop("selected", true);

	$('#USE_FIRST_NAME').val(data[0].USE_FIRST_NAME);
	$('#USE_LAST_NAME').val(data[0].USE_LAST_NAME);
	$('#USE_CELL').val(data[0].USE_CELL);
	$('#USE_HOME').val(data[0].USE_HOME);
	$('#USE_EMAIL').val(data[0].USE_EMAIL);
	$('#USE_ADDRESS_1').val(data[0].USE_ADDRESS_1);
	$('#USE_CITY').val(data[0].USE_CITY);
	$('#USE_STATE').val(data[0].USE_STATE);
	$('#USE_ZIP').val(data[0].USE_ZIP);

	}
	// End If data.length

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<button type="button" id="button_select_record">SELECT RECORD</button>
<br>
<br>
<table id="table_select_distinct_user" border="1">

<tbody>
<tr>
<td>USERNAME</td>
<td><input type="text" id="USE_USERNAME" name="USE_USERNAME" value="" readonly=""></td>
</tr>

<tr>
<td>PASSWORD</td>
<td><input type="password" id="USE_PASSWORD" name="USE_PASSWORD" value=""></td>
</tr>

<tr>
<td>LEVEL</td>
<td>
<select id="USE_LEVEL" name="USE_LEVEL">
<option value="" selected=""></option>
<option value="TECH">TECH</option>
<option value="SENIOR TECH">SENIOR TECH</option>
<option value="SUPERVISOR">SUPERVISOR</option>
<option value="MANAGER">MANAGER</option>
<option value="ADMIN">ADMIN</option>
</select>
</td>
</tr>

<tr>
<td>STATUS</td>
<td>
<select id="USE_STATUS" name="USE_STATUS">
<option value="" selected=""></option>
<option value="ACTIVE">ACTIVE</option>
<option value="SUSPENDED">SUSPENDED</option>
<option value="TERMINATED">TERMINATED</option>
<option value="RESIGNED">RESIGNED</option>
</select>
</td>
</tr>

<tr>
<td>FIRST NAME</td>
<td><input type="text" id="USE_FIRST_NAME" name="USE_FIRST_NAME" value=""></td>
</tr>

<tr>
<td>LAST NAME</td>
<td><input type="text" id="USE_LAST_NAME" name="USE_LAST_NAME" value=""></td>
</tr>

<tr>
<td>CELL</td>
<td><input type="text" id="USE_CELL" name="USE_CELL" value=""></td>
</tr>

<tr>
<td>HOME</td>
<td><input type="text" id="USE_HOME" name="USE_HOME" value=""></td>
</tr>

<tr>
<td>EMAIL</td>
<td><input type="text" id="USE_EMAIL" name="USE_EMAIL" value=""></td>
</tr>

<tr>
<td colspan="2"><input type="text" id="autocomplete" onfocus="geolocate();" value="" placeholder="search address..." style="width: 100%; margin-top: 5px; margin-bottom: 5px;"></td>
</tr>

<tr>
<td>ADDRESS 1</td>
<td><input type="text" id="USE_ADDRESS_1" name="USE_ADDRESS_1" value=""></td>
</tr>

<tr>
<td>CITY</td>
<td><input type="text" id="USE_CITY" name="USE_CITY" value=""></td>
</tr>

<tr>
<td>STATE</td>
<td><input type="text" id="USE_STATE" name="USE_STATE" value=""></td>
</tr>

<tr>
<td>ZIP</td>
<td><input type="text" id="USE_ZIP" name="USE_ZIP" value=""></td>
</tr>

</tbody>

</table>

＆＃13;

如何引用JSON对象中的数据

1 个答案: