2017-06-13 8 views
0

はフィドルです:ドロップダウンメニューでhttps://jsfiddle.net/6aevjxkx/38/JSの問題

、あなたはネブラスカ州を選択した場合、あなたは表示されませんワシントン州、から学校の場所が表示されます。

私が考えている問題は、スクリプトが一致するすべての状態のイニシャルについて全部のセクションを検索していることです。ワシントンの学校の場合は、アドレスに「NE」と表示され、ドロップダウンからネブラスカを選択すると表示されます。

これで、クラス "状態"を持つdiv内の一致する状態のみを検索できるように、スクリプトをどのように更新できますか?または、別の解決策がある場合、私の耳は広く開いています。

ありがとうございます!

スクリプトのコード以下の作品のような

$('select#stateCollege').change(function(e) { 
    var letter = $(this).val(); 
    if (letter === 'ALL') { 
     $ ('table.event tr').css('display','inline-block'); 
    } else { 
     $('table.event tr').each(function(rowIdx,tr) { 
      $(this).hide().find('td').each(function(idx, td) { 
       if(idx === 0 || idx === 1) { 
        var check = $(this).text(); 
        if (check && check.indexOf(letter) > 0) { 
         $(this).parent().css('display','inline-block'); 
        } 
       } 
     });    
    }); 
    }    
}); 

答えて

1

何か:

$('table.event tr').each(function(rowIdx, tr) { 
    var row = $(this).hide(); 
    var state = row.find('.state').text().trim(); 
    if (state === letter) 
     row.css('display', 'inline-block'); 
}); 

更新デモ:https://jsfiddle.net/6aevjxkx/42/

現在の行を非表示にし、ある、そのの.text()を見つけます.state要素、.trim()というと、.indexOf()ではなく、===を使用して、わかりやすく名前が付けられたletter変数の値と比較します。

tdが各行に1つしかない場合、td要素には.each()を使用する必要はありません。

+0

ありがとうございました、nnnnnn!それは素晴らしい作品で、私が持っていたものよりはるかに簡単です。知識を共有していただければ幸いです! – user2428993