我正在使用以下单选按钮来过滤一系列项目:
<label>Numbers</label><br/>
<input type="radio" name="number" value="1">1<br/>
<input type="radio" name="number" value="2">2<br/>
<label>Letters</label><br/>
<input type="radio" name="letter" value="a">a<br/>
<input type="radio" name="letter" value="b">b
项目标记如下所示:
<ul class="all-options">
<li class="1 a">
<h3>Price</h3>
<h2>$1000</h2>
</li>
<li class="1 b">
<h3>Price</h3>
<h2>$1500</h2>
</li>
<li class="2 a">
<h3>Price</h3>
<h2>$1200</h2>
</li>
<li class="2 b">
<h3>Price</h3>
<h2>$1300</h2>
</li>
</ul>
我正在使用此功能根据更改事件进行过滤:
$(function () {
$('input[type="radio"]').on('change', function () {
var number = $("[name='number']:checked").val();
var letter = $("[name='letter']:checked").val();
$("li").hide();
$("li").filter(function (index) {
return $(this).hasClass(number) && $(this).hasClass(letter);
}).show();
});
});
除了一件事之外,这一切都很有效:我希望在加载页面时自动选择每个类别(数字和字母)中的第一个单选按钮。并且,我希望这些选择能够反映在过滤器中。因此,在这种情况下,例如,在页面加载时,我希望看到带有类1和1的项目。一个。
有什么想法吗?
答案 0 :(得分:0)
使用checked属性,如下所示:
<label>Numbers</label><br/>
<input type="radio" name="number" value="1" checked>1<br/>
<input type="radio" name="number" value="2">2<br/>
<label>Letters</label><br/>
<input type="radio" name="letter" value="a" checked>a<br/>
<input type="radio" name="letter" value="b">b