Javascript 添加“未找到结果”选项

我正在使用脚本自动完成搜索字段。我试图添加一个“找不到结果”选项，但却找不到任何在其后面有超链接的内容。我正在努力找出如何向其中添加一个else（）来显示文本

如何添加此脚本？多谢各位

$(document).ready(function(){
     $.ajaxSetup({ cache: false });
     $('#search').keyup(function(){
      $('#result').html('');
      $('#state').val('');
      var searchField = $('#search').val();
      var expression = new RegExp(searchField, "i");
      $.getJSON('data.json', function(data) {
       $.each(data, function(key, value){
        if (value.name.search(expression) != -1 || value.location.search(expression) != -1)
        {
         $('#result').append('<li class="list-group-item link-class"> '+value.name+'</li>');
        }
       });   
      });
     });

     $('#result').on('click', 'li', function() {
      var click_text = $(this).text().split('|');
      $('#search').val($.trim(click_text[0]));
      $("#result").html('');
     });
    });

$（文档）.ready（函数（）{
$.ajaxSetup（{cache:false}）；
$（“#搜索”）.keyup（函数（）{
$（'#result'）.html（''）；
$（'#state'）.val（''）；
var searchField=$（'#search'）.val（）；
var表达式=新的RegExp（searchField，“i”）；
$.getJSON（'data.json'，函数（数据）{
$。每个（数据、函数（键、值）{
if（value.name.search（表达式）！=-1 | | value.location.search（表达式）！=-1）
{
$（“#result”）.append（“
”+value.name+”
”）；
}
});   
});
});
$（'#result'）。在（'click'，'li'，function（）上{
var单击_text=$（this.text（）.split（“|”）；
$（'#search'）.val（$.trim（单击文本[0]）；
$（“#结果”）.html（“”）；
});
});

我会在循环中使用布尔值表示找到了一个，然后在循环后检查布尔值

$.getJSON('data.json', function(data) {
  var found = false;

  $.each(data, function(key, value) {
    if (value.name.search(expression) != -1 || value.location.search(expression) != -1) {
      found = true;

      $('#result').append('<li class="list-group-item link-class"> ' + value.name + '</li>');
    }
  });

  if (!found) {
    $('#result').append('<li class="list-group-item link-class">NOTHING FOUND</li>');
  }
});

---

在此基础上，我想我应该把字符串映射到一个数组，然后做一个附加

$.getJSON('data.json', function(data) {
  var liHTML = data.filter(function(value) {
    return value.name.search(expression) != -1 ||
           value.location.search(expression) != -1;
  }).map(function(value) {
     return '<li class="list-group-item link-class"> ' + value.name + '</li>';
  });

  if (!liHTML.length)
    liHTML.push('<li class="list-group-item link-class">NOTHING FOUND</li>');

  $('#result').append(liHTML.join(""));
});

$.getJSON（'data.json'，函数（数据）{
var liHTML=data.filter（函数（值）{
返回值.name.search（表达式）！=-1||
value.location.search（表达式）！=-1；
}).map（函数（值）{
返回“
”+value.name+”
”；
});
如果（！liHTML.length）
liHTML.push（“
未找到任何内容”
”；
$（'#result'）.append（liHTML.join（“”）；
});

我会在循环中使用布尔值表示找到了一个，然后在循环后检查布尔值

$.getJSON('data.json', function(data) {
  var found = false;

  $.each(data, function(key, value) {
    if (value.name.search(expression) != -1 || value.location.search(expression) != -1) {
      found = true;

      $('#result').append('<li class="list-group-item link-class"> ' + value.name + '</li>');
    }
  });

  if (!found) {
    $('#result').append('<li class="list-group-item link-class">NOTHING FOUND</li>');
  }
});

---

在此基础上，我想我应该把字符串映射到一个数组，然后做一个附加

$.getJSON('data.json', function(data) {
  var liHTML = data.filter(function(value) {
    return value.name.search(expression) != -1 ||
           value.location.search(expression) != -1;
  }).map(function(value) {
     return '<li class="list-group-item link-class"> ' + value.name + '</li>';
  });

  if (!liHTML.length)
    liHTML.push('<li class="list-group-item link-class">NOTHING FOUND</li>');

  $('#result').append(liHTML.join(""));
});

$.getJSON（'data.json'，函数（数据）{
var liHTML=data.filter（函数（值）{
返回值.name.search（表达式）！=-1||
value.location.search（表达式）！=-1；
}).map（函数（值）{
返回“
”+value.name+”
”；
});
如果（！liHTML.length）
liHTML.push（“
未找到任何内容”
”；
$（'#result'）.append（liHTML.join（“”）；
});

每次都会得到一个（显然是）静态JSON值，这似乎很奇怪，所以我将其与一些其他内容一起缓存。请注意，如果生成的数据不是静态的，您可能希望为快键人员限制键控

这会有助于看到实际JSON的一个片段来进行测试，但这应该是可行的

• 使用

  let

  避免全局爬行
• 缓存选择器以避免DOM遍历
• 使用推荐的文档就绪处理程序表单
• 从JSON获得一次值（我假设它是静态的，但看起来是静态的）
• 甚至对粘贴到字段中的文本（或其他代码）也添加了更改，如测试-注意，您可以在单击处理程序中进行更改
• 使用

  .remove（）

  对于儿童，可能更快，使用最大真实数据测试
• 将

  a

  添加到无结果，将其固定到适当的位置/href

$（函数（）{
$.ajaxSetup({
缓存：false
});
//缓存选择器
让结果=$（“#结果”）；
设state=$（“#state”）；
让搜索=$（“#搜索”）；
//创建空项
让resultItem=$（'
）；
//不从空项创建结果，如果需要，可以是动态的`href`
让noResultItem=resultItem.clone（）.html（“”）；
//我们可能不需要每次都得到这个？缓存它
let dataHold={}；//空的holder
$.getJSON（'data.json'，函数（数据）{
数据保持=数据；
});
//也为粘贴etc用户更改事件。
search.on（'keyup change'，function（））{
//可能比.html（“”）快。请测试此假设
result.children（）.remove（）；
state.val（“”）；//不确定这是用于什么或设置它的原因
让searchField=search.val（）；
let expression=new RegExp（searchField，“i”）；
//如果找到的结果集很大，则无法缓存该结果集并追加一次
$。每个（数据保持、函数（键、值）{
if（value.name.search（表达式）！=-1 | | value.location.search（表达式）！=-1）{
append（resultItem.clone（）.text（value.name））；
}
});
//不匹配？使用空
如果（！result.children（）.length）{
noResultItem.附录（结果）；
}
});
//我们是否还需要“li.list组项”类？
结果。在（'click'，'li'，函数（）上{
单击_text=$（this.text（）.split（“|”）；
search.val（$.trim（单击[0]）；
result.children（）.remove（）；
});
})；

搜索：
声明：

每次都会得到一个（显然是）静态JSON值，这似乎有些奇怪，所以我将其与其他内容一起缓存。请注意，如果生成的数据不是静态的，您可能希望限制快捷键用户的键控

这会有助于看到实际JSON的一个片段来进行测试，但这应该是可行的

• 使用

  let

  避免全局爬行
• 缓存选择器以避免DOM遍历
• 使用推荐的文档就绪处理程序表单
• 从JSON获得一次值（我假设它是静态的，但看起来是静态的）
• 甚至对粘贴到字段中的文本（或其他代码）也添加了更改，如测试-注意，您可以在单击处理程序中进行更改
• 使用

  .remove（）

  对于儿童，可能更快，使用最大真实数据测试
• 将

  a

  添加到无结果，将其固定到适当的位置/href

$（函数（）{
$.ajaxSetup({
缓存：false
});
//缓存选择器
让结果=$（“#结果”）；
设state=$（“#state”）；
让搜索=$（“#搜索”）；
//创建空项
设resultItem=$（'