Question

我尝试从JSON收集数据，以便在匹配结果后填写相关的输入文本字段，但它无效。

如何从JSON填充输入文本字段？

JS代码

$(document).ready(function(){
var filter = document.getElementById('zipcode');
var JSONtbl = [
		{"zipcode":01702,"address":"334 CONCORD ST","County":"MIDDLESEX"},
		{"zipcode":02482,"address":"27 Atwood St","County":"NORFOLK"},
		{"zipcode":02459,"address":"189 Cypress St","County":"MIDDLESEX"}
	     ];
filter.onkeyup = function() {
    var zipcodeToSearch = filter.value;
    var n = zipcodeToSearch.length;
    if (n < 5) {
    	document.getElementById("address").innerHTML = "";
    	document.getElementById("County").innerHTML = "";
    } else {
        for (var i = 0; i < JSONtbl.length; i++) {
        	if (JSONtbl[i].zipcode == zipcodeToSearch) {
        		document.getElementById("address").innerHTML = JSONtbl[i].address;
        		document.getElementById("County").innerHTML = JSONtbl[i].County;
             }
        }
        if (document.getElementById("address").innerHTML == "") {
            alert("ZipCode Out Of Area")
        }
    }
};
});

div {
    padding: 2px 5px;
}

<form method="post">
<div><input type="text" id="zipcode"/></div>
<div><input type="text" id="address" disabled="disabled"></div>
<div><input type="text" id="County" disabled="disabled"></div>
</form>

Answer 1

代码中有两个错误。

首先：输入没有innerHTML而是值。第二您要从零开始为zipcode分配整数。而是需要一个字符串类型，因为输入返回的值将是一个字符串。

使用此代码

var filter = document.getElementById('zipcode');
var JSONtbl = [
		{"zipcode":"01702","address":"334 CONCORD ST","County":"MIDDLESEX"},
		{"zipcode":"02482","address":"27 Atwood St","County":"NORFOLK"},
		{"zipcode":"02459","address":"189 Cypress St","County":"MIDDLESEX"}
	     ];
filter.onkeyup = function() {
    var zipcodeToSearch = filter.value;
    var n = zipcodeToSearch.length;
    if (n < 5) {
    	document.getElementById("address").value = "";
    	document.getElementById("County").value = "";
    } else {
        for (var i = 0; i < JSONtbl.length; i++) {
            
        	if (JSONtbl[i].zipcode == zipcodeToSearch) {
           
        		document.getElementById("address").value = JSONtbl[i].address;
        		document.getElementById("County").value = JSONtbl[i].County;
             }
        }
        if (document.getElementById("address").value == "") {
            alert("ZipCode Out Of Area")
        }
    }
};

div {
    padding: 2px 5px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form method="post">
<div><input type="text" id="zipcode"/></div>
<div><input type="text" id="address" disabled="disabled"></div>
<div><input type="text" id="County" disabled="disabled"></div>
</form>

Answer 2

我认为你可以这样做：

$('#Input_id').val(JsonValue);

Answer 3

输入元素没有内部html属性。相反，他们有一个value属性。所以这个：

document.getElementById("address").innerHTML = JSONtbl[i].address;
document.getElementById("County").innerHTML = JSONtbl[i].County;

应该是：

document.getElementById("address").value = JSONtbl[i].address;
document.getElementById("County").value = JSONtbl[i].County;

Answer 4

试试这个！

$(document).ready(function(){
        var filter = document.getElementById('zipcode');
        var JSONtbl = [
                {"zipcode":"01702","address":"334 CONCORD ST","County":"MIDDLESEX"},
                {"zipcode":"02482","address":"27 Atwood St","County":"NORFOLK"},
                {"zipcode":"02459","address":"189 Cypress St","County":"MIDDLESEX"}
                 ];
        filter.onkeyup = function() {
            var zipcodeToSearch = filter.value;
            var n = zipcodeToSearch.length;
            if (n < 5) {
                document.getElementById("address").value = "";
                document.getElementById("County").value = "";
            } else {

                for (var i = 0; i < JSONtbl.length; i++) {

                    if (JSONtbl[i].zipcode == zipcodeToSearch) {

                        document.getElementById("address").value = JSONtbl[i].address;
                        document.getElementById("County").value = JSONtbl[i].County;
                     }
                }
                if (document.getElementById("address").value == "") {
                    alert("ZipCode Out Of Area")
                }
            }
        };
    });

如何使用Javascript填充输入文本字段

4 个答案: