-1

ですから、この検索ボックスをウェブのメインページに置いて、「ギャラリー(ジェイソンファイル)から名前で車を検索」してユーザーに表示したいのですが、今は完全ではありません。この目標を達成する方法を確認してください。実際のコードに関するサポートをいただければ幸いです。

私のジェイソンファイル:

{
"cars" :
    [
        {
            "model": "Mazda Nagare",
            "year": "2013",
            "country": "Japan",
            "plate": "y72-28f-609",
            "price": "220,000",
            "pic" : "images/MazdaNag.jpg"
        },  
        {
            "model": "BMW M135i",
            "year": "2011",
            "country": "Germany",
            "plate": "bmw-016-ur2",
            "price": "140,000",
            "pic" : "images/BMWM135i.jpg"
        },  
        {
            "model": "Mazda 6",
            "year": "2007",
            "country": "Germany",
            "plate": "x57-6u6-fev",
            "price": "110,000",
            "pic" : "images/Mazda6.jpg"
        },  
        {
            "model": "Toyota 9T",
            "year": "2013",
            "country": "Japan",
            "plate": "qwe-rty-013",
            "price": "390,000",
            "pic" : "images/toyota_9turbo.jpg"
        },  
        {
            "model": "Toyota GTS",
            "year": "2012",
            "country": "Japan",
            "plate": "6r2-x0r-65y",
            "price": "177,000",
            "pic" : "images/ToyotaGts.jpg"
        },  
        {
            "model": "Toyota GT-86",
            "year": "2013",
            "country": "Japan",
            "plate": "ca1-pw9-n3x",
            "price": "260,000",
            "pic" : "images/ToyotaGt86.jpg"
        }
    ]

}

私の検索ボックスとボタン(検索結果用に作成した新しい空白のページを開きます):

<div id="searchBox" data-theme="a">
    <input type="search" placeholder="Search for a car by name">
    </div>
<div class="smallButtonStyle">
    <input type="button" value="Search" onClick="location.href='#search'" data-icon="arrow-r" data-transition="slide"/>
4

1 に答える 1

1

このstackoverflowの回答をご覧になることをお勧めします ただし、コードが必要な場合は、このjavascriptでjsonを照会できます。

アイデアは、関数を使用して入力要素の値を取得し、名前の配列を介してブルートフォースを使用することです。これだけの場合は、代わりに車の配列をオブジェクトにする方がはるかに高速です (オブジェクトのキーは車の名前です)。幸運を。

<script>
var jsonArray = {}; //your json array
var mySearchFunction = function () {
    var the_searched_name = document.getElementById("my_search").value;
    for (car in jsonArray["cars"]) {
      if (car["model"] == the_searched_name) {
        // Do something with 'car' 
      }
    }
};
</script>


<div id="searchBox" data-theme="a">
    <input id="my_search" type="search" placeholder="Search for a car by name">
    </div>
<div class="smallButtonStyle">
    <input type="button" value="Search" onClick="mySearchFunction()" data-icon="arrow-r" data-transition="slide"/>
于 2013-03-16T18:34:01.240 に答える