第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

基于復(fù)選框過濾對(duì)象數(shù)組

基于復(fù)選框過濾對(duì)象數(shù)組

您好,我想根據(jù)選中的復(fù)選框過濾我的數(shù)據(jù)。我有 3 個(gè)復(fù)選框。<input type="checkbox" name="shoes" value="shoes" class="storesCheckBox" /><input type="checkbox" name="clothes" value="clothes" class="storesCheckBox" /><input type="checkbox" name="sports" value="sports" class="storesCheckBox" />我的商店數(shù)據(jù)是// my storesvar stores = [    {        id: 1,        store: 'Store 1',        storeType: "shoes"    },    {        id: 2,        store: 'Store 2',        storeType: "clothes"    },    {        id: 3,        store: 'Store 3',        storeType: "sports"    },    {        id: 4,        store: 'Store 3',        storeSells: "shoes"    }]所以,如果我選中shoes復(fù)選框,我想根據(jù) storeType 過濾數(shù)據(jù)shoes。所以我寫了var getStores = stores.filter(function (store) {    return store.storeType === 'shoes';});但是現(xiàn)在,如果我檢查clothes并且shoes已經(jīng)檢查。我想過濾shoes + clothes數(shù)據(jù)。如果我取消選中,shoes我只想過濾衣服數(shù)據(jù)。它可以是任意數(shù)量的復(fù)選框,具體取決于商店類型。你能幫我解決這個(gè)問題嗎?
查看完整描述

3 回答

?
UYOU

TA貢獻(xiàn)1878條經(jīng)驗(yàn) 獲得超4個(gè)贊

你可以試試這個(gè):


var storeTypesSelected; //array of the types checked

var getStores = stores.filter(function (store) {

    return storeTypesSelected.indexOf(store.storeType) > -1;

});


查看完整回答
反對(duì) 回復(fù) 2021-12-23
?
慕妹3242003

TA貢獻(xiàn)1824條經(jīng)驗(yàn) 獲得超6個(gè)贊

從選中的復(fù)選框中,構(gòu)建所選值的數(shù)組(或集)。然后,在遍歷數(shù)組時(shí),檢查當(dāng)前storeType是否包含在集合中:


var stores = [{

    id: 1,

    store: 'Store 1',

    storeType: "shoes"

  },

  {

    id: 2,

    store: 'Store 2',

    storeType: "clothes"

  },

  {

    id: 3,

    store: 'Store 3',

    storeType: "sports"

  },

  {

    id: 4,

    store: 'Store 3',

    storeType: "shoes"

  }

];


document.addEventListener('change', () => {

  const checkedValues = [...document.querySelectorAll('.storesCheckBox')]

    .filter(input => input.checked)

    .map(input => input.value);

  const filteredStores = stores.filter(({ storeType }) => checkedValues.includes(storeType));

  console.log(filteredStores);

});

Shoes: <input type="checkbox" name="shoes" value="shoes" class="storesCheckBox" />

Clothes: <input type="checkbox" name="clothes" value="clothes" class="storesCheckBox" />

Sports: <input type="checkbox" name="sports" value="sports" class="storesCheckBox" />


查看完整回答
反對(duì) 回復(fù) 2021-12-23
?
拉風(fēng)的咖菲貓

TA貢獻(xiàn)1995條經(jīng)驗(yàn) 獲得超2個(gè)贊

您只需要在數(shù)組中保存用于過濾的復(fù)選框值。


var elems = document.getElementsByClassName("storesCheckBox");

var list = [];

for(var i=0; elems[i]; ++i){

      if(elems[i].checked){

           list.push(elems[i].value);

      }

}

var getStores = stores.filter(function (store) {

    return list.indexOf(store.storeType) >= 0;

});

return 語句將使用 indexOf 函數(shù)進(jìn)行過濾。


查看完整回答
反對(duì) 回復(fù) 2021-12-23
  • 3 回答
  • 0 關(guān)注
  • 158 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)