如何使用ajax将搜索框结果重定向到HTML页面

时间:2019-01-25 14:48:49

标签: html json ajax

这是使用搜索框使用ajax进行实时搜索的代码,如果单击搜索框的结果,则可以说是否搜索“印度”,然后单击搜索结果,如果单击,则应移至例如'india.html。 json文件将包含“印度”条目

<script>
$(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"><img src="'+value.image+'" height="40" width="40" class="img-thumbnail" /> '+value.name+' | <span class="text-muted">'+value.location+'</span></li>');
    }
   });   
  });
 });

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

0 个答案:

没有答案