Question

我正在尝试使用监护人api构建新闻网站，并使用用户输入搜索此api以返回每个匹配元素的webTitle属性。我知道简单地将用户输入附加到ajax调用中将是完成此任务的一种更简单的方法，但我正在寻找一些挑战，所以我决定将ajax响应分配给全局数组并迭代到找到用户输入但我在迭代数组时遇到问题。

全局数组和ajax调用的代码在这里;

var searchQuery=[];           

                $.ajax({
                    url: 'https://content.guardianapis.com/search?&api-key=xxxx',
                    async: true,
                    dataType: "json",
                    success: function(data){
                        searchQuery.push(data);
                    }
                });

这就像输出到控制台时一样，它显示了填充了ajax调用中所有元素的数组。

我只是想知道如何使用这个数组，并使用JQuery，迭代它并检查是否有任何元素包含来自我的应用程序中的输入文本框的用户输入，最好是在单击搜索按钮时，代码这是在这里;

<div id="search">
                            <div class="input-group col-md-12">
                                <input type="text" class="search-query form-control" placeholder="Search" id= 'userSearch' <a href="#" data-toggle="popover" title="How To Search" data-content="Enter a Key Word and Receive News Stories Associated With It"></a>
                                <span class="input-group-btn">
                                    <button class="btn btn-primary mb1 bg-blue" type="button" id="submitSearch">
                                        <span class=" glyphicon glyphicon-search"></span>
                                    </button>
                                </span>
                            </div>
</div>

对此的任何帮助都将非常感激，我确信这只是我对网络开发的经验不足给我的问题所以请不要过多地评价我哈哈。

Answer 1

这个怎么样：

$("#submitSearch").on("click", function(){
    var keyword = $("#userSearch").val();
    searchQuery.map(function(item){
        if(item.indexOf(keyword) != -1){
            //found, do something about it 
            console.log(item);
        }
    }); 
});

Answer 2

根据您的要求，这里可以帮助您：

var searchQuery;
var keyword = $("#userSearch").val().toLowerCase();

$.ajax({
   url: 'https://content.guardianapis.com/search?api-key=xxxx',
   async: true,
   dataType: "json",
   success: function(data){
      searchQuery =  data.response.results;
   }
});

$("#submitSearch").on("click", function(){
    for(i=0;i<searchQuery.length;i++){
       if(searchQuery[i].webTitle.toLowerCase().indexOf(keyword) > 0){
         console.log(searchQuery[i].webTitle);
         console.log(searchQuery[i].webUrl);
         console.log(searchQuery[i].apiUrl);
       }
    } 
});

如何遍历全局数组并返回用户输入

2 个答案: