特定の値

Question

のためのjQueryの検索JSON私は（あなたが下の私のコードを見たときに、すぐに私はどのように新しい表示されます）jQueryとJSONに新たなんです。

私はJSONファイルを持っていると私は入力するユーザーに（JSONファイル内のキーになります））と、対応するJSON値がウェブページ上に表示されていた検索用語をできるようにしたいです。

私はこのフォーラムやウェブを検索したと、私が見つけた例を使用して、私はそれが動作していないです！一緒にスクリプトといくつかのHTMLしかし、驚きをハッキングしてきました。私はスクリプトが何をしているのかについて大まかに考えていますが、間違っているものを整理することは非常に難しいと感じています。誰かが助けることができる願って

。

HTML：

<input type="search" name="search" id="search"> 

のjQuery：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 

<script> 

$('#search').keyup(function() { 
    var searchField = $('#search').val(); 
    var myExp = new RegExp(searchField, "i"); 
    $.get('products.json', function(data) { 
     var output = '<ul class="searchresults">'; 
     $(data).find(searchField).each(function(index, value){ 
      var val = value.firstChild.nodeValue; 
      if ((val.search(myExp) != -1)) { 
       output += '<li>' + val + '</li>'; 
      }  
     }); 
     output += '</ul>'; 
     $('#result').html(output); 
    }); 
}); 

</script> 

JSON（products.json）（。JSONファイルはこれより長くなりますが、私はそれを簡略化してきました）：

{"colors":[ 
    {"A":"red"}, 
    {"B":"green"}, 
    {"C":"blue"} 
]} 

したがって、ユーザーがHTML検索フィールドに「B」を入力すると、Webページに「緑色」が表示されます。

Answer 1

これを試してください：あなたの特定の問題のいくつかのより多くの説明を

$('#search').keyup(function() { 
    var searchField = $('#search').val(); 
    $.getJSON('https://api.myjson.com/bins/59t77', function(data) { 
    console.log(data); 
     var output = '<ul class="searchresults">'; 
     $.each(data.colors, function(k, obj) { 
      if(obj[searchField]) { 
       output += '<li>' + obj[searchField] + '</li>'; 
      } 
     }); 
     output += '</ul>'; 
     $('#result').html(output); 
    }); 
}); 

は、私はより良い代替手段であなたを助けることができるかもしれません。

デモ：https://jsfiddle.net/iRbouh/0z228fya/

Answer 2

シンプルコード：

if (typeof json.colors['B'] != 'undefined') { 
    console.log(json.colors['B']); 
} 

Answer 3

あなたは以下のようにオブジェクトの配列からフィルタデータ用grepを使用することができます。

http://manojmahato.com.np/javascript/jquery-remove-item-array-objects-jquery/

var id = 1; 
var result = $.grep(data, function(e){ 
return e.id != id; 
}); 

JSON からこのフィルタデータはなく、あなたのケースであなたは、キー のために配列からオブジェクトをフィルタ処理する必要があるので、あなたが次にあなたが結果をバインドすることができます

var data = {"colors":[ 
    {"A":"red"}, 
    {"B":"green"}, 
    {"C":"blue"} 
]}; 

var result=[]; 
var SeacrchKey="A"; 
$.each(data.colors, function(key, value) { 
if (SeacrchKey in value) 
    result.push(value); 
}); 
console.log(result) 

としてeachを使用することができます要求に応じ。 結果はこれを試して濾過オブジェクト

Answer 4

の配列を含む：

$('#search').keyup(function() { 
var searchField = $('#search').val(); 
var output = '<ul class="searchresults">'; 
$.get('products.json', function(data) { 
    jQuery.each(data.colors, function(i, val) { 
     jQuery.each(val, function(i1, val1) { 
      if(i1==searchField){ 
       output += '<li>' + val1 + '</li>'; 
      } 
     }); 
    }); 
    output += '</ul>'; 
}); 
$('#result').html(output); 

}）。