我有一个MySQL数据库,它使用PHP生成以下HTML。
<div class="item filterable united-states" data-amount="14000">
Supplier Country: United States
Delivery Estimation: 5 days
Quote Amount: 14000
<div>
<div class="item filterable united-states" data-amount="7000">
Supplier Country: United States
Delivery Estimation: 30 days
Quote Amount: 7000
<div>
<div class="item filterable united-kingdom" data-amount="13000">
Supplier Country: United Kingdom
Delivery Estimation: 15 days
Quote Amount: 13000
<div>
<div class="item filterable germany" data-amount="8700">
Supplier Country: Germany
Delivery Estimation: 22 days
Quote Amount: 8700
<div>
我还创建了一个循环,根据结果集中的国家/地区创建复选框。它的HTML看起来像:
<div class="checkbox check-default" id="country-filter">
<strong>Countries</strong><br>
<input type="checkbox" value="germany" id="germany-checkbox" />
<label for="germany-checkbox">Germany</label>
<input type="checkbox" value="united-kingdom" id="united-kingdom-checkbox" />
<label for="united-kingdom-checkbox">United Kingdom</label>
<input type="checkbox" value="united-states" id="united-states-checkbox" />
<label for="united-states-checkbox">United States</label>
</div>
所以我找到了一些jQuery片段,并对其进行了编辑,以过滤如下结果:
$("#country-filter :checkbox").click(function() {
$("div.item").hide();
$("#country-filter :checkbox:checked").each(function() {
$("div." + $(this).val()).show().slideDown(400);
});
});
jQuery片段有助于过滤结果,但不是按照我希望的方式。结果加载得很好,当选中复选框时,它会得到应该显示得很好的结果。但是,如果取消选中所有复选框,则所有结果都将消失,直到单击某个复选框为止。
此外,我想要另一个过滤器来处理与国家过滤器协同工作的金额部分。
我该怎么做?
对于第一个问题,用替换$("div.item").hide();
if ($("#country-filter :checkbox:checked").length > 0)
{
$("div.item").hide();
}
else
{
$("div.item").show();
}
对于另一个,在进入每个循环之前,设置一个变量(javascript或jquery)并将其设置为0。从您显示的每个div中获取并添加数据量参数的内容。完成后,您将有一个变量,其中包含