亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

使用 jQuery 返回過濾后的 JSON 響應

使用 jQuery 返回過濾后的 JSON 響應

一只名叫tom的貓 2022-10-27 16:26:16
我試圖在原始 JSON 響應的成功 GET 請求后使用 jQuery 返回過濾的 JSON 響應。原始 JSON 響應是我們 Shopify 商店中針對用戶所在的給定集合頁面的一系列產品。我正在嘗試將完整的 JSON 響應過濾為一個新的 JSON 響應,該響應過濾掉所有不包含用戶從下拉列表中選擇的標簽的產品。用戶選擇的標簽是 getFilterProducts 函數的輸入。以下是 JSON 的示例:{    products: [        {            "id": 1,            "title": "white shirt",            "tags": [                "small"                "medium"                "large"            ]        },        {            "id": 2,            "title": "black shirt",            "tags": [                "medium"                "large"            ]        },        {            "id": 3,            "title": "blue shirt",            "tags": [                "small"                "medium"                "large"            ]        }    ]}      這是 jQuery GET 的代碼:function getFilterProducts(tag){    $.ajax({        type: 'GET',        url: coll_url + '/products.json',        dataType: 'json',        success: function(res){          var productArray = $(res.products).filter(function() {              return res.products.tags === tag;          });          console.log(productArray);        },        error: function(status){             alert(status);        }    })}因此,如果用戶從下拉列表中選擇標簽“Small”,它應該找到哪些產品具有“Small”標簽,并返回一個新的 JSON 響應,其中僅包含白色和藍色襯衫。我覺得我已經很接近了,但我無法理解為什么每個標簽的響應都是空的。
查看完整描述

3 回答

?
回首憶惘然

TA貢獻1847條經驗 獲得超11個贊

利用jQuery.inArray()


var productArray = res.products.filter(function(product) {

              return jQuery.inArray(tag, product.tags) !== -1;


});

var res = {

  products: [{

      "id": 1,

      "title": "white shirt",

      "tags": [

        "small",

        "medium",

        "large"

      ]

    },

    {

      "id": 2,

      "title": "black shirt",

      "tags": [

        "medium",

        "large"

      ]

    },

    {

      "id": 3,

      "title": "blue shirt",

      "tags": [

        "small",

        "medium",

        "large"

      ]

    }

  ]

};

tag = 'small';

var productArray = res.products.filter(function(product) {

  return jQuery.inArray(tag, product.tags) !== -1;

});


console.log( productArray );

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>



查看完整回答
反對 回復 2022-10-27
?
料青山看我應如是

TA貢獻1772條經驗 獲得超8個贊

你可以使用 JS(不是 jQuery)Array.prototype.filter()Array.prototype.includes()


const res = {

  products: [{

      "id": 1,

      "title": "white shirt",

      "tags": [

        "small",

        "medium",

        "large",

      ]

    },

    {

      "id": 2,

      "title": "black shirt",

      "tags": [

        "medium",

        "large",

      ]

    },

    {

      "id": 3,

      "title": "blue shirt",

      "tags": [

        "small",

        "medium",

        "large",

      ]

    }

  ]

};


const tag = "small";

const productArray = res.products.filter(item => item.tags.includes(tag));

console.log(productArray);

以下是 jQuer 的.filter()功能及其工作原理的一個小提示:https ://api.jquery.com/filter/


查看完整回答
反對 回復 2022-10-27
?
肥皂起泡泡

TA貢獻1829條經驗 獲得超6個贊

警告:您的 json 格式錯誤。以下是正確的:


{

  "products": [ 

       {

         "id": 1,

         "title": "white shirt",

         "tags": [

                 "small",

                 "medium",

                 "large"

         ]

       },

       {

         "id": 2,

         "title": "black shirt",

         "tags": [

                 "medium",

                 "large"

         ]

       },

       {

         "id": 3,

         "title": "blue shirt",

         "tags": [

                 "small",

                 "medium",

                 "large"

         ]

       }

    ]

}

這是您要查找的代碼:


我們檢查標簽列表中包含我們想要的標簽的每個產品。


ajax 操作成功后調用filterProducts函數。出于演示目的,我剪切了 ajax 部分。


const JSON_DATA = JSON.parse(`{"products":[{"id":1,"title":"white shirt","tags":["small","medium","large"]},{"id":2,"title":"black shirt","tags":["medium","large"]},{"id":3,"title":"blue shirt","tags":["small","medium","large"]}]}`);


const TAG = "small";


function filterProducts(json_products, tag) {

   if(json_products === undefined || tag === undefined) return [];

   

   return json_products.products.filter((product) =>

       product.tags.includes(tag)

   );

}


console.log(filterProducts(JSON_DATA, TAG));


查看完整回答
反對 回復 2022-10-27
  • 3 回答
  • 0 關注
  • 136 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號