4

jQueryでリストビューを動的に生成しようとしています。これはリスト全体で完全に機能しますが、最初のデータをフィルター/検索/削減する必要があります。

var rezepte = [
{ "name" : "Eierkopf" , "zutaten" : ["Eier", "Zucker"] , "zubereitung" : "alles schön mischen." },
{ "name" : "Käseschnitte" , "zutaten" : ["Käse", "Brot", "Paprika"] , "zubereitung" : "Käse drauf und in den Ofen" },
{ "nme" : "Gemüse-Auflauf" , "zutaten" : ["Lauch"] , "zubereitung" : "1. schneiden 2. Kochen 3. essen" }
];

次のような検索配列で「レシピ」をフィルタリング/検索したいと思いますvar searcharray = ["Zucker", "Paprika"]。

var result = [
{ "name" : "Eierkopf" , "zutaten" : ["Eier", "Zucker"] , "zubereitung" : "alles schön mischen." },
{ "name" : "Käseschnitte" , "Zutaten" : ["Käse", "Brot", "Paprika"] , "zubereitung" : "Käse drauf und in den Ofen" }];

for ループ内で多くのことを試しました: フィルター、マップ、プッシュ - しかし、すべて成功せず、常に未定義のオブジェクトになります。

また、レシピ配列がどのような構文であるべきかわかりません。可変量の「成分」の可能性があるに違いありません。

ヘルプとヒントをいただければ幸いです。

どうもありがとう、アンディ

4

2 に答える 2

3

ネイティブ配列関数を使用すると、これは機能するはずです。

result = recipes.filter(function(recipe) {
    return search.any(function(ingredient) {
        return recipe.ingredients.indexOf(ingredient) != -1;
    });
});

jQueryを使用すると、

result = $.grep(recipes, function(recipe) {
    for (var i=0; i<search.length; i++)
        if ($.inArray(recipe.ingredients, search[i]) != -1)
            return true;
    return false;
});
于 2012-11-16T10:09:17.240 に答える
1 
var rezepte = [
{ "name" : "Eierkopf" , "zutaten" : ["Eier", "Zucker"] , "zubereitung" : "alles schön mischen." },
{ "name" : "Käseschnitte" , "zutaten" : ["Käse", "Brot", "Paprika"] , "zubereitung" : "Käse drauf und in den Ofen" },
{ "nme" : "Gemüse-Auflauf" , "zutaten" : ["Lauch"] , "zubereitung" : "1. schneiden 2. Kochen 3. essen" }
];

function search() {
    var search = $("#searchfield").val(); // returns string
    var searcharray = search.split(',');
    if (searcharray == "") {
        check = $.isArray(searcharray);
        alert(check); // true
        return rezepte;
    } else { 
        var result = [];
        alert("till here fine");
        result = $.grep(rezepte, function(rezept) {
            for (var i=0; i<searcharray.length; i++) {
                if ($.inArray(searcharray[i], rezept.zutaten) != -1)
                    return true;
            } 
             return false;
        });
    }
    console.log(result);
    return result;  
}
$(function(){
     $("#search").click(search);
})

このコードで動作しています。デモを参照してください: http://jsfiddle.net/VcZtE/1/ (結果はブラウザ コンソールで確認できます)。コードとの唯一の違いは次のとおり if ($.inArray(searcharray[i], rezept.zutaten) != -1)です。針のドキュメントによるとinArray、検索する最初のパラメーターと配列は-2番目です。配列は最初のパラメーターとして渡され、針 (検索する値) は 2 番目のパラメーターとして渡されます。

于 2012-11-16T16:35:44.127 に答える