поиска данных, которые имеют одинаковые теги

Question

я пытаюсь создать простой поиск на основе JQuery и файла JSON, я хочу, чтобы получить данные, которые имеют такой же tag после поиска конкретного Title здесь является JSON

[ 
    { 
     "title": " Title one ", 
     "description": " description one ", 
     "link": "http://expample1.com", 
     "tag": { 
      "tag1": "Stackoverflow", 
      "tag2": "Demo one" 
     } 
    }, 
    { 
     "title": " Title Two ", 
     "description": " description Two ", 
     "link": "http://expample2.com", 
     "tag": { 
      "tag1": "Stackoverflow", 
      "tag2": "Demo two" 
     } 
    }, 
    { 
     "title": " Title Three ", 
     "description": " description Three ", 
     "link": "http://expample3.com", 
     "tag": { 
      "tag1": "Tag thre", 
      "tag2": "Demo Three" 
     } 
    } 
] 

и вот DEMO на JSFIDDLE

, например, когда я типа заголовок один я хочу показать Название одного и титул два, потому что они имеют тот же tag1: stackoverflow

Answer 1

Здесь вы найдете основной поиск. Теперь вам нужно только повторить цикл и проверить те же теги.

http://jsfiddle.net/8xhnyueo/3/

Мой алгоритм поиска:

$('#search').on("keyup", function() { 
    $("#res").empty(); 
    for(var i=0;i<data.length;i++){ 
     if(data[i].titre.indexOf($(this).val()) !== -1) { 
      var output = '<li>'; 
      output += '<h3><a href='+ data[i].link +' target="blank">'+ data[i].titre + '</a></h3>'; 
      output += '<span>'+ data[i].description +'</span>'; 
      output += '<h6>'+ data[i].tag.tag1 +''+ data[i].tag.tag2 +'</h6>'; 
      output += '<h6></h6>'; 
      output += '</li>'; 
      $("#res").append(output); 
     } 
    } 
}); 

Answer 2

вы можете попробовать, как этот

HTML код

<div class="ui-widget"> 
     <input type="text" name="search" id="search"> 
     <div id="res"></div> 
    </div> 

Javascript код

$(document).ready(function(){ 
    $('#search').bind("enterKey",function(e){ 
     var want = $("#search").val(); 
     var myExp = new RegExp(want, "i"); 
     var data = [ 
    { 
     "titre": " Title one ", 
     "description": " description one ", 
     "link": "http://expample1.com", 
     "tag": { 
      "tag1": "Stackoverflow", 
      "tag2": "Demo one" 
     } 
    }, 
    { 
     "titre": " Title Two ", 
     "description": " description Two ", 
     "link": "http://expample2.com", 
     "tag": { 
      "tag1": "Stackoverflow", 
      "tag2": "Demo two" 
     } 
    }, 
    { 
     "titre": " Title Three ", 
     "description": " description Three ", 
     "link": "http://expample3.com", 
     "tag": { 
      "tag1": "Tag thre", 
      "tag2": "Demo Three" 
     } 
    } 
]; 
      var output = '<ul class="results">'; 
      var bool = false; 
      $.each(data, function(key, val){ 
       for(var prop in val) { 
        console.log(prop); 
        console.log(typeof val[prop]); 
        if(typeof val[prop] == 'object') { 
         output += checkNestedTag(want, val[prop]); 
        } 
        if(prop == want && typeof val[want] != 'object') { 
         output += '<li>'; 
         output += '<h3>'+ val[want]+'</a></h3>'; 
         output += '</li>'; 
        } else if(typeof val[want] == 'object') 
         bool = true; 
       } 
      }); 

      if(bool) 
       output += '<li>Value is in object</li>'; 
      output += '</ul>'; 
      $("#res").html(output); 
     }); 
    $('#search').keyup(function(e){ 
     if(e.keyCode == 13){ 
      $(this).trigger("enterKey"); 
     } 
    }); 

}); 


function checkNestedTag(want, val) { 

    var output = ''; 
    for(var prop in val) { 

     if(typeof val[prop] == 'object') { 
      output += checkNestedTag(want, val[prop]); 
     } 
     if(prop == want) { 
      output += '<li>'; 
      output += '<h3>'+ val[want]+'</a></h3>'; 
      output += '</li>'; 
     } 
    } 

    return output; 
} 

Я не уверен, но я думаю, что это полезно для вас. http://jsfiddle.net/szvvh8dL/1/