从 url 获取 JSON 数据，以便使用 jQuery 对 JSON 对象数据进行实时搜索

Question

I just want to get json data for below search html, from a url( https://script.google.com/macros/s/AKfycby86-ByZKrlbpPkjPQniimtSzWXMste4PlJakUxToivqUptdD9F/exec ).我只想从 url( https://script.google.com/macros/s/AKfycby86-ByZKrlbpPkjPQniimtSzWXMste4PlJakUxToivqUptdD9F/exec ) 获取以下搜索 html 的 json 数据。 In below html file, I want to fetch json data from above link for search and filtering.在下面的 html 文件中，我想从上面的链接中获取 json 数据以进行搜索和过滤。 Currently it has json data on the html file ('var data =[json]') but I want it be replaced with my link.目前它在 html 文件中有 json 数据（'var data =[json]'），但我想用我的链接替换它。 Could you please guide me through this.你能不能指导我完成这个。

<!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>

Answer 1

I suppose you simply want to fetch some JSON from a URL?我想您只是想从 URL 中获取一些 JSON？

You did not provide an implementation of your loadJSON function so I would go with something like the following for fetching JSON from a URL:你没有提供你的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)

Please further elaborate on your problem / provide more information if this was not what you were asking.如果这不是您要问的问题，请进一步详细说明您的问题/提供更多信息。

从 url 获取 JSON 数据，以便使用 jQuery 对 JSON 对象数据进行实时搜索

问题描述

1 个解决方案

解决方案1
0 2020-09-02 17:44:00

从 url 获取 JSON 数据，以便使用 jQuery 对 JSON 对象数据进行实时搜索

问题描述

1 个解决方案

解决方案1 0 2020-09-02 17:44:00

解决方案1
0 2020-09-02 17:44:00