MixItUp price range
Добрый день!
В JS новичок, только начинаю разбираться постепенно. Стоит задача сделать фильтр цены. Нашел готовую реализацию со слайдером http://codepen.io/sahilpopli/details/GJoEWy/ Моя версия, с формой ввода http://codepen.io/anon/pen/eJyqwa Проблема с циклом как мне кажется
for (i = minValue; i <= maxValue; i += 500) {
filterValues.push(".price-" + i);
}
Помогите разобраться! |
Цитата:
|
Цитата:
Об успехах здесь отпишусь |
фильтрация по цене
smmaxim,
для медитации... поставьте минимум и максимум цены, можно не указывать любой из параметров, тогда в эту сторону без ограничений
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function() {
function c() {
var d = +a[0].value || 0, e = +a[1].value || 0;
b.not(b.filter(function(a, c) {
var b = +$(c).data("price");
return d && b < d || e && b > e ? !1 : !0
}).fadeIn()).fadeOut()
}
var a = $(".range"),b = $(".mix");
a.on({input: c });
c()
});
</script>
</head>
<body>
<label for="">min<input type="text" name="rangemin" value="2000" placeholder="2000" class="range"/></label>
<label for="">max<input type="text" name="rangemax" value="10000" placeholder="10000" class="range"/></label>
<div class="mix" data-price="10000">10000</div>
<div class="mix" data-price="10000">10000</div>
<div class="mix" data-price="10000">10000</div>
<div class="mix" data-price="500">500</div>
<div class="mix" data-price="500">500</div>
<div class="mix" data-price="500">500</div>
<div class="mix" data-price="3000">3000</div>
<div class="mix" data-price="3000">3000</div>
<div class="mix" data-price="2000">2000</div>
<div class="mix" data-price="2000">2000</div>
</body>
</html>
|
| Часовой пояс GMT +3, время: 00:01. |