teledexterus Ответов: 1

Jquery и HTML5 для поиска JSON

У меня есть сохраненный файл JSON "ftp://mysite.com/json1.json" в моей корневой папке сервера.
Это должно означать, что "http://www.mysite.com/json1.json-это правда?

Я пытаюсь использовать поле поиска, чтобы найти первое: "thefirstname", а затем распечатать остальные.

Я ничего не получаю в последних трех текстовых полях.

<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.1.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script type="text/javascript">
        function process() {
        	$.getJSON("http://www.mysite.com/json1.json"){
        		$each(function(key,val){
        			if ($("#text1").val()="thefirstname" && key="first"){
	        	            $("#firstname").val(key.first);
		                    $("#lastname").val(key.last);
		                    $("#description").val(key.desc);
			         }
			});
	      	});
        }
    </script>
      <form name="myform" action="jQueryJson.htm">
	    <input type="text" name="text1" value="thefirstname" size="30" />                    <tr><td align="center" colspan="3">
<input type="button" name="search" value="Search for FirstName" size="50" onclick="process" /></td><td align="center"></td><td align="center">
</td></tr>
<input type="text" name="firstname" value="" size="4"/></td><td align="center">
<input type="text" name="lastname" value="" size="4"/></td><td align="center">
<input type="text" name="description" value="" size="4"/>
	</form>


json1.json
[
	{"first":"fgdfb", last":"dfghdfgh", "desc":"jjif"},
	{"first":"jdtyhjn", last":"hmbnmgh", "desc":"hfhhfyif"},
	{"first":"fgbnfgjthj", last":"tewgsdfgngh", "desc":"argrayif"},
	{"first":"kuykyky", last":"bfbffc", "desc":"lykghif"},
	{"first":"thefirstname", last":"dsfhngh", "desc":"pgkkgff"},
	{"first":"ghjjhb", last":"fdasfgh", "desc":"nfhdfhjif"},
	{"first":"ohhklhjb", last":"qsdwdgh", "desc":"vfrfeif"}
]


Что я уже пробовал:

Попробовал использовать кнопку, но это было проще.

1 Ответов

Рейтинг:
0

Peter Leow

Существует довольно много синтаксических ошибок , например, оператор equal должен быть"==", а не "=". В файле json также отсутствуют кавычки. Однако я не буду вдаваться в такие подробности. Ваш вопрос действительно о том, как пройти через массив объектов json и получить доступ к их свойствам (ключам).
Попробуйте адаптироваться к этой демо-версии:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $.getJSON("json1.json", function(result){
            $.each(result, function(i, obj){
                $("div").append(obj.first + " " + obj.last + " " + obj.desc + " " + "<br>");
            });
        });
    });
});
</script>
</head>
<body>

<button>Get JSON data</button>

<div></div>

</body>
</html>
Предположим, что "json1.json" находится в том же каталоге html-файла и содержит:
[
	{"first":"fgdfb", "last":"dfghdfgh", "desc":"jjif"},
	{"first":"jdtyhjn", "last":"hmbnmgh", "desc":"hfhhfyif"},
	{"first":"fgbnfgjthj", "last":"tewgsdfgngh", "desc":"argrayif"},
	{"first":"kuykyky", "last":"bfbffc", "desc":"lykghif"},
	{"first":"thefirstname", "last":"dsfhngh", "desc":"pgkkgff"},
	{"first":"ghjjhb", "last":"fdasfgh", "desc":"nfhdfhjif"},
	{"first":"ohhklhjb", "last":"qsdwdgh", "desc":"vfrfeif"}
]

teledexterus

Ни то, ни другое не распечатывает содержимое json1.json в div
$(документ).готово(функция(){
$. getJSON("json1. json", функция (результат){
$. each(result, function(i, obj){
$("див").добавить(объект.первый + "" + объект.последние + "" + объект.описание + "" + "&ЛТ;БР&ГТ;");
});
});
});

Peter Leow

Да, это работает. Не используйте chrome Если вы не используете веб-сервер, вместо этого используйте firefox для его тестирования.