Как мне получить jQuery для проверки числовых значений? - PullRequest
Новая
       10

Как мне получить jQuery для проверки числовых значений?

1 голос
/ 26 июня 2019

В моем коде есть оператор if, который проверяет, является ли значение из тега выбора больше или равно другому значению из другого тега выбора.

Как я могу изменить свой код, чтобы он проверял это численно вместо обычного юникодного способа? Например, возвращается 1000000, что меньше 500000.

Я не совсем уверен, что я должен искать здесь, к сожалению. Любая помощь в правильном направлении будет принята с благодарностью.

HTML 

<select id="price_min" name="price_min" class="custom-select">
  <option value="1" selected>Any min</option>
  <option value="50000">£50,000</option>
  <option value="100000">£100,000</option>
  <option value="150000">£150,000</option>
  <option value="200000">£200,000</option>                
  <option value="300000">£300,000</option>                
  <option value="400000">£400,000</option>                
  <option value="500000">£500,000</option>
  <option value="1000000">£1,000,000</option>
  <option value="2000000">£2,000,000</option>
  <option value="5000000">£5,000,000</option>
  <option value="10000000">£10,000,000</option>
</select>

<select id="price_max" name="price_max" class="custom-select">
  <option value="1" selected>Any max</option>
  <option value="50000">£50,000</option>
  <option value="100000">£100,000</option>
  <option value="150000">£150,000</option>
  <option value="200000">£200,000</option>
  <option value="300000">£300,000</option>
  <option value="400000">£400,000</option>
  <option value="500000">£500,000</option>
  <option value="1000000">£1,000,000</option>
  <option value="2000000">£2,000,000</option>
  <option value="5000000">£5,000,000</option>
  <option value="10000000">£10,000,000</option>
</select>

JQuery: 

   var min = $('#price_min').val(),
   max = $('#price_max').val();


  $('#price_max option').show();

  if (min != 1) {
    $('#price_max option').filter(function(){
      return parseInt(this.value,10) <= min;
    }).hide();

    if (min >= max) {

      $('#price_max').val(min);
      $('#price_max option:selected').next().attr('selected', 'selected');
    }
  }

Когда минимальная цена выбрана, все значения ниже этого значения будут скрыты из максимального списка. Когда минимальная цена выбрана и выше выбранной максимальной цены, она должна скрыть соответствующие значения, а затем выбрать следующее наибольшее значение, доступное в максимальном списке.

Что бы ни случилось, я не хочу, чтобы кто-либо мог выбрать более низкую цену в максимальном списке, чем тот, который уже выбран в минимальном списке.

Спасибо

Ответы [ 2 ]

2 голосов
/ 26 июня 2019

Вы можете использовать parseInt() для достижения этой цели.Я вижу в вашем коде, что вы уже используете его в одном месте, но лучше всего сделать это в тот момент, когда вы создаете значения min и max: 

var min = parseInt($('#price_min').val(), 10),
  max = parseInt($('#price_max').val(), 10);

$('#price_max option').show();

if (min != 1) {
  $('#price_max option').filter(function() {
    return parseInt(this.value, 10) <= min;
  }).hide();

  if (min >= max) {
    $('#price_max').val(min);
    $('#price_max option:selected').next().prop('selected', true);
  }
}
0 голосов
/ 26 июня 2019

Мой подход будет следующим: 

var $min = $('#price_min');
var $max = $('#price_max');

var minVal = getNumber($min.val())
var maxVal = getNumber($max.val())


if (minVal != 1) {
  $max.find('option').filter(function() {
    return getNumber(this.value) <= minVal;
  }).hide();

  if (minVal >= maxVal) {
    $max.val(minVal);
    $max.find('option:selected').next().prop('selected', true);
  }
}

function getNumber(value){
   return parseInt(value, 10); //10 is the radix, it ranges from 2-36
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="price_min" name="price_min" class="custom-select">
  <option value="1" selected>Any min</option>
  <option value="50000">£50,000</option>
  <option value="100000">£100,000</option>
  <option value="150000">£150,000</option>
  <option value="200000">£200,000</option>                
  <option value="300000">£300,000</option>                
  <option value="400000">£400,000</option>                
  <option value="500000">£500,000</option>
  <option value="1000000">£1,000,000</option>
  <option value="2000000">£2,000,000</option>
  <option value="5000000">£5,000,000</option>
  <option value="10000000">£10,000,000</option>
</select>

<select id="price_max" name="price_max" class="custom-select">
  <option value="1" selected>Any max</option>
  <option value="50000">£50,000</option>
  <option value="100000">£100,000</option>
  <option value="150000">£150,000</option>
  <option value="200000">£200,000</option>
  <option value="300000">£300,000</option>
  <option value="400000">£400,000</option>
  <option value="500000">£500,000</option>
  <option value="1000000">£1,000,000</option>
  <option value="2000000">£2,000,000</option>
  <option value="5000000">£5,000,000</option>
  <option value="10000000">£10,000,000</option>
</select>
...