ユーザーが電話のブランドを選択するために使用する選択タグがあり、jqueryを使用するページにそれらの電話が表示されるという問題に遭遇しました。
スタック オーバーフローに関する人々の助けのおかげで、これは現在、Firefox を除くすべてのブラウザーでうまく機能します。何らかの理由でページを更新すると、選択タグには最後に選択したオプションが表示されますが、ページには設計どおりに使用可能なすべての電話が表示されます。Firefox に選択タグを更新させることについて、何か提案やアドバイスはありますか? js.fiddle では表示されないため、表示できません。
コードは次のとおりです。
<select class="manufacturers">
<option class="selected" value="all">All</option>
<option value="motorola">Motorola</option>
<option value="htc">HTC</option>
<option value="lg">LG</option>
<option value="samsung">Samsung</option>
<option value="kyocera">Kyocera</option>
</select>
<div class="scroll-content">
<ul class="manulist motorola">
<li><a href="#">Motorola Triumph</a></li>
</ul>
<ul class="manulist htc">
<li><a href="#">HTC WILDFIRE S</a></li>
</ul>
<ul class="manulist lg">
<li><a href="#">LG Optimus Slider</a></li>
<li><a href="#">LG Optimus V</a></li>
<li><a href="#">LG Rumor Touch</a></li>
<li><a href="#">LG Rumor 2</a></li>
<li><a href="#">LG 101</a></li>
</ul>
<ul class="manulist samsung">
<li><a href="#">Samsung Intercept</a></li>
<li><a href="#">Samsung Restore</a></li>
<li><a href="#">Samsung M575</a></li>
</ul>
</div>
jquery:
$(document).ready(function() {
$('.manufacturers').change(function() {
var selected = $(this).find(':selected');
$('ul.manulist').hide();
if ($(this).val() == 'all') {
$('.scroll-content ul').show();
} else {
$('.' + selected.val()).show();
$('.optionvalue').html(selected.html()).attr(
'class', 'optionvalue ' + selected.val());
}
});
});
アドバイスやヘルプをお寄せいただきありがとうございます。