Фильтр по диапозону цены

var filterAll = $('.filter-all'), 
    boxs = $('.box'), 
    length = boxs.length; 
filterAll.text(length);   
var count_box; 
 
var filter =   filter = new RegExp($(":checkbox:checked") 
                         .map(function() { 
                           return this.value; 
                         }).get().join("|") ); 
                          
$('input:checkbox').on('load change', function() { 
 
   
   
  filter = new RegExp($(":checkbox:checked") 
                         .map(function() { 
                           return this.value; 
                         }).get().join("|") ); 
   
  $(".box").each(function() { 
    var $this = $(this);  
     
    if(filter.test($this.attr("class")) ) {   
        $this.show();   
    }else{ 
       $this.hide();    
    }  
    if(filter.source == ""){ 
       $this["show"];  
    } 
  });     
   
   var values = []; 
 values[0] = $(".noUi-handle.noUi-handle-lower").attr("aria-valuetext"); 
 values[1] = $(".noUi-handle.noUi-handle-upper").attr("aria-valuetext");  
  range_change( values  );   
   
  count_box();   
}); 
 
// Range Slider 
var range = document.getElementById('range'), 
    t = [], 
    maximum = parseInt(range.attributes.max.value, 10), 
    minimum = parseInt(range.attributes.min.value, 10), 
    delta = (maximum - minimum) / 4, 
    options = { 
      min: [minimum], 
      "25%": [minimum + delta * 1, 1e6], 
      "50%": [minimum + delta * 2, 1e6], 
      "75%": [minimum + delta * 3, 1e6], 
      max: [maximum] 
    }; 
 
//console.log(minimum + delta * 1, 1e6); 
 
t.push(parseInt(range.attributes.min.value, 10)),  
  t.push(parseInt(range.attributes.max.value, 10)); 
var n = parseInt(range.attributes.max.value, 10);  
// i = parseInt(range.attributes.min.value, 10), 
 
noUiSlider.create( 
  range,  
  { 
    range: options, 
    start: t, 
    connect: !0, 
    pips: { 
      mode: "range", 
      density: 2 
    } 
  } 
); 
 
$(".noUi-value-horizontal").each(function() { 
  var range = $(this).text().split("").slice(0, -6).join(""); 
  $(this).html(range); 
}); 
 
function range_change(values, handle){  
 $(".box").each(function() { 
    var $this = $(this); 
        price = $this.data('price'); 
     
    var val1 =  values[0]; 
    var val2 =  values[1];  
      
      
    if(price <= val2 && price >= val1 && filter.test($this.attr("class")) ) { 
      $this.show(); 
    }else { 
      $this.hide(); 
    }  
     
  });  
} 
range.noUiSlider.on('change', function(values, handle){  
 range_change(values, handle);  
 count_box();  
}); 
 
function count_box() { 
   countbox = $('.content').find(".box:visible").length;  
   $(".filter-slect").text(countbox); 
} 
 
//   var filterSelect = $('.filter-select'), 
//     boxs = $('.box'), 
//     length = boxs.length; 
//     filterSelect.text(length);

ul { 
  list-style-type: none; 
  margin: 0; 
  padding: 0; 
} 
 
* { 
  box-sizing: border-box; 
} 
 
/* input[type="checkbox"] { 
  display: none; 
} */ 
 
li { 
  display: inline-block; 
} 
 
.filter-item { 
    border: 4px solid #ccc; 
    margin: .1rem; 
    padding: .5rem .95rem; 
    cursor: pointer; 
    display: inline-block; 
    vertical-align: middle; 
} 
 
 
input[type="checkbox"]:checked+label, 
.filter-item.active,  
.filter-item:hover,  
.filter-item:not(.active):hover { 
    background: #333; 
    color: #fff; 
} 
 
.slider-wrapper { 
  margin-top: 1rem; 
  margin-bottom: 3rem; 
  padding: 0 1rem; 
} 
 
.filter-res { 
  border: 1px solid #ccc; 
  padding: 10px; 
  margin-bottom: 1rem; 
} 
 
.filter-res span { 
  color: red; 
} 
 
.box { 
  width: 8rem; 
  height: 8rem; 
  background: #ccc; 
  margin: 1rem; 
  padding: 3rem 0; 
  display: inline-block; 
  text-align: center; 
  font-family: monospace; 
}

<script src="https://code.jquery.com/jquery-2.2.4.js"></script> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/10.1.0/nouislider.min.css" /> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/10.1.0/nouislider.min.js"></script> 
   
   
<div class="filter"> 
  Кол-во комнат 
  <ul class="list"> 
    <li class="item"> 
      <input type="checkbox" id="room-1" value="room-1"> 
      <label for="room-1" class="filter-item" > 
        1         
      </label> 
    </li> 
    <li class="item"> 
      <input type="checkbox" id="room-2" value="room-2"> 
      <label for="room-2" class="filter-item" > 
        2         
      </label> 
    </li> 
    <li class="item"> 
      <input type="checkbox" id="room-3" value="room-3"> 
      <label for="room-3" class="filter-item" > 
        3         
      </label> 
    </li> 
  </ul> 
  <br> 
   
  Метраж 
  <ul class="list"> 
    <li class="item">       
      <input type="checkbox" id="area-1" value="area-1"> 
      <label for="area-1" class="filter-item" > 
        50-100         
      </label> 
    </li> 
    <li class="item"> 
      <input type="checkbox" id="area-2" value="area-2"> 
      <label for="area-2" class="filter-item" > 
        100-200         
      </label> 
    </li> 
  </ul> 
   
  <br> 
   
  Цена 
  <div class="slider-wrapper"> 
    <div id="range" max="28420000" min="6130000"></div> 
  </div> 
   
  <br> 
  <div class="filter-res"> 
    Выбрано <span class="filter-slect">0</span> из <span class="filter-all">0</span>  
  </div> 
   
</div> 
   
  <div class="content"> 
    <div class="box room-1 area-1" data-price="6140000"> 
      room="1" <br> area="70" <br> 6 140 000 
    </div> 
     
    <div class="box room-2 area-2" data-price="17000000"> 
      room="2" <br> area="70" <br> 17 000 000 
    </div> 
     
    <div class="box room-3 area-3" data-price="27000000"> 
      room="3" <br> area="70" <br> 27 000 000 
    </div> 
  </div>