从多个JSON文件，Javascript，AJAX进行实时搜索 [英] Live Search from multiple JSON files, Javascript, AJAX

问题描述

我必须使用AJAX和jQuery实现一个搜索栏，以显示3个JSON文件的结果.目前，我可以使用它，但是我不确定如何将其同时用于实时搜索3个单独的JSON文件.

I have to implement a search bar using AJAX and jQuery that displays results from 3 JSON files. At the moment I have it working with one but I am not sure how I might adapt this to live search 3 separate JSON files simultaneously.

const search = document.querySelector('#search');
search.addEventListener('keydown', liveSearch);

function liveSearch() {
    const searchField = search.value;
    const myExp = new RegExp(searchField, "i");

    $.getJSON('weekday.json', function(data) {
        var output = '<ul>';
        $.each(data, function(key, val) {
            if ((val.Title.search(myExp) !== -1) || (val.Description.search(myExp) !== -1)) {
                output += '<li>';
                output += '<strong>' + val.Title + '</strong>';
                output += '<p>' + val.Description + ' - ' + val.Price + '</p>';
                output += '</li>';
            }
        });
        output += '</ul>';
        $('#output').html(output);
    });
}

任何帮助将不胜感激.

Any help would be appreciated.

推荐答案

您可以使用$.when执行多个异步Promise ```

you can use $.when to execute multiple async promise ```

$.when(
   $.getJSON('weekday1.json'),
   $.getJSON('weekday2.json'),
   $.getJSON('weekday3.json')
).then(function (results) {
   var r1 = results[0]; // result in weekday1.json
   var r2 = results[1]; // result in weekday2.json
   var r3 = results[2]; // result in weekday3.json
})

注意:promise(.then函数)仅在所有异步任务都解决后才能解决.

Note: the promise(.then function) will only be resolved after all async task are resolved.

参考: https://api.jquery.com/jquery.when/

这篇关于从多个JSON文件，Javascript，AJAX进行实时搜索的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！