if文でネストされたループの問題

Question

ifステートメントを含むこのネストされたforループのヘルプが必要です。私がしたいのは、resultFlatsのオブジェクトの配列（resultFlats[i].id）に含まれているこの唯一のサイトに表示することです。 これで正しく動作しません。 LiとresultFlatsからIDから

の取得数のIDが正常に動作しているが、間違ったSTHはあなたがbreakステートメントを追加する必要が声明

var arrayFlats = $('.search-my-house'); 
 
// e.g. 
 
var resultFlats = [ 
 
    { 
 
    name: "test", 
 
    id: "1" 
 
    }, 
 
    { 
 
    name: "test2", 
 
    id: "4" 
 
    } 
 
] 
 

 
for (var j = 0; j < arrayFlats.length; j++) { 
 
    var number; 
 
    number = $(arrayFlats[j]).children('.apartment-number').text(); 
 
    number = number.replace(/\s/g, ""); 
 
    number = Number(number); 
 
    for (var i = 0; i < resultFlats.length; i++) { 
 
     var showId = Number(resultFlats[i].id) 
 
     if(showId === number) { 
 
      $(arrayFlats[j]).css('display', 'flex') 
 
     } else { 
 
      $(arrayFlats[j]).css('display', 'none') 
 
     } 
 
    }; 
 
};

<li class="search-my-house" data-loggia="" data-taras="1"> 
 
    <div class="col description-small text-bold all-apartments apartment-number">22</div> 
 
    <div class="col description-small text-bold all-apartments levels">piętro 1</div> 
 
    <div class="col description-small text-bold all-apartments rooms">4</div> 
 
    <div class="col description-small text-bold all-apartments">168m<sup>2</sup></div> 
 
    <div class="col description-small text-bold all-apartments is-occupied">free</div> 
 
    <div class="col description-small"> 
 
     <a href="wolne" class="button secondary"> 
 
      <span>download</span> 
 
     </a> 
 
    </div> 
 
</li> 
 

 
<li class="search-my-house" data-loggia="" data-taras="1"> 
 
    <div class="col description-small text-bold all-apartments apartment-number">1</div> 
 
    <div class="col description-small text-bold all-apartments levels">piętro 1</div> 
 
    <div class="col description-small text-bold all-apartments rooms">4</div> 
 
    <div class="col description-small text-bold all-apartments">168m<sup>2</sup></div> 
 
    <div class="col description-small text-bold all-apartments is-occupied">free</div> 
 
    <div class="col description-small"> 
 
     <a href="wolne" class="button secondary"> 
 
      <span>download</span> 
 
     </a> 
 
    </div> 
 
</li> 
 

 
<li class="search-my-house" data-loggia="" data-taras="1"> 
 
    <div class="col description-small text-bold all-apartments apartment-number">184</div> 
 
    <div class="col description-small text-bold all-apartments levels">piętro 1</div> 
 
    <div class="col description-small text-bold all-apartments rooms">4</div> 
 
    <div class="col description-small text-bold all-apartments">168m<sup>2</sup></div> 
 
    <div class="col description-small text-bold all-apartments is-occupied">free</div> 
 
    <div class="col description-small"> 
 
     <a href="wolne" class="button secondary"> 
 
      <span>download</span> 
 
     </a> 
 
    </div> 
 
</li>

Answer 1

場合とがあるようにするとき、あなたの条件ループの途切れが一致し、その他のresultFlatsのCSSはelse文の影響を受けません。だから、次のように実行します。

if(showId === number) 
{ 
    $(arrayFlats[j]).css('display', 'flex'); 
    break; 
} 
else 
{ 
    $(arrayFlats[j]).css('display', 'none') 
} 

Answer 2

アイデアは次のとおりです。1.すべて非表示要素が最初に、その後、マッチング1 は `break`を、使用して

var resultFlats = [ 
    { 
    name: "test", 
    id: "1" 
    }, 
    { 
    name: "test2", 
    id: "4" 
    } 
] 
$('.search-my-house').css('display', 'none'); 
for (var i = 0; i < resultFlats.length; i++) { 
    var showId = Number(resultFlats[i].id); 
    $('.search-my-house').each(function() { 
    var number = $('.apartment-number', this).text().replace(/\s/g, ""); 
    number = Number(number); 
     if(showId === number) { 
     $(this).css("display", 'flex'); 
     }; 
    }); 
}