從 url 獲取 JSON 數據，以便使用 jQuery 對 JSON 對象數據進行實時搜索
[英]get JSON data from a url for a Live search on JSON Objects Data Using jQuery
問題描述
我只想從 url( https://script.google.com/macros/s/AKfycby86-ByZKrlbpPkjPQniimtSzWXMste4PlJakUxToivqUptdD9F/exec ) 獲取以下搜索 html 的 json 數據。 在下面的 html 文件中，我想從上面的鏈接中獲取 json 數據以進行搜索和過濾。 目前它在 html 文件中有 json 數據（'var data =[json]'），但我想用我的鏈接替換它。 你能不能指導我完成這個。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<title>js-tutorials.com : live json search</title>
</head>
<body>
<div class="container" style="padding:50px 250px;">
<h1>Live Search</h1>
<div id="header"></div>
<form role="form">
<div class="form-group">
<input type="input" class="form-control input-lg" id="txt-search" placeholder="Type your search character">
</div>
</form>
<div id="filter-records"></div>
<div id="footer"></div>
</div>
</body>
</html>
<script type="text/javascript">
$(document).ready(function(){
$('#header').load('../header-ads.html');
$('#footer').load('../footer-ads.html');
var data = [{"id":"12","employee_name":"john","employee_salary":"34456","employee_age":"44","profile_image":"https://catnop.com/a.jpg"},{"id":"13","employee_name":"george","employee_salary":"43,643","employee_age":"45","profile_image":"https://catnop.com/a.jpg"},{"id":"14","employee_name":"lisa","employee_salary":"23456","employee_age":"33","profile_image":"https://catnop.com/a.jpg"},{"id":"15","employee_name":"alina","employee_salary":"46765","employee_age":"43","profile_image":"https://catnop.com/a.jpg"},{"id":"16","employee_name":"katka","employee_salary":"46,436","employee_age":"49","profile_image":"https://catnop.com/a.jpg"},{"id":"17","employee_name":"mila","employee_salary":"355446","employee_age":"54","profile_image":"https://catnop.com/a.jpg"},{"id":"18","employee_name":"selena","employee_salary":"55543","employee_age":"33","profile_image":"https://catnop.com/a.jpg"},{"id":"19","employee_name":"lucia","employee_salary":"43466","employee_age":"44","profile_image":"https://catnop.com/a.jpg"}] ;
$('#txt-search').keyup(function(){
var searchField = $(this).val();
if(searchField === '') {
$('#filter-records').html('');
return;
}
var regex = new RegExp(searchField, "i");
var output = '<div class="row">';
var count = 1;
$.each(data, function(key, val){
if ((val.employee_salary.search(regex) != -1) || (val.employee_name.search(regex) != -1)) {
output += '<div class="col-md-6 well">';
output += '<div class="col-md-3"><img class="img-responsive" src="'+val.profile_image+'" alt="'+ val.employee_name +'" /></div>';
output += '<div class="col-md-7">';
output += '<h5>' + val.employee_name + '</h5>';
output += '<p>' + val.employee_salary + '</p>'
output += '</div>';
output += '</div>';
if(count%2 == 0){
output += '</div><div class="row">'
}
count++;
}
});
output += '</div>';
$('#filter-records').html(output);
});
});
</script>
1 個解決方案
解決方案1
0 2020-09-02 17:44:00
我想您只是想從 URL 中獲取一些 JSON？
你沒有提供你的loadJSON函數的實現，所以我會使用類似下面的東西來從 URL 獲取 JSON：
fetch("https://script.google.com/macros/s/AKfycby86-ByZKrlbpPkjPQniimtSzWXMste4PlJakUxToivqUptdD9F/exec")
.then(r => r.json())
.then(console.log)
.catch((e) => "Fetching json failed:", e)
如果這不是您要問的問題，請進一步詳細說明您的問題/提供更多信息。
無法將jSON數據作為文本從jquery中的url for phonegap app獲取？
[英]Cannot get JSON data as text from a url in jquery for phonegap app?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.