Не срабатывает select OnChange

408
24 ноября 2016, 09:55

Добрый день. Столкнулся с проблемой, не могу проверить. На входе имеем следующую форму калькулятора:

<FORM Name="myform" class="calcform">
    <SELECT NAME="width" onChange="calculatePrice()" id="width">
        <OPTION value="20">20 см.</OPTION>
        <OPTION value="30">30 см.</OPTION>
        <OPTION value="40">40 см.</OPTION>
        <OPTION value="50">50 см.</OPTION>
        <OPTION value="60">60 см.</OPTION>
        <OPTION value="70">70 см.</OPTION>
        <OPTION value="80">80 см.</OPTION>
        <OPTION value="90" style="display: inline-block;">90 см.</OPTION>
        <OPTION value="100" style="display: inline-block;">100 см.</OPTION>
        <OPTION value="110" style="display: inline-block;">110 см.</OPTION>
        <OPTION value="120" style="display: inline-block;">120 см.</OPTION>
        <OPTION value="130" style="display: inline-block;">130 см.</OPTION>
        <OPTION value="140" style="display: inline-block;">140 см.</OPTION>
        <OPTION value="150" style="display: inline-block;">150 см.</OPTION>
        <OPTION value="160" style="display: inline-block;">160 см.</OPTION>
        <OPTION value="170" style="display: inline-block;">170 см.</OPTION>
        <OPTION value="180" style="display: inline-block;">180 см.</OPTION>
        <OPTION value="190" style="display: inline-block;">190 см.</OPTION>
        <OPTION value="200" style="display: inline-block;">200 см.</OPTION>
    </SELECT>
    <SELECT NAME="height" onChange="calculatePrice()" id="height">
        <OPTION value="20">20 см.</OPTION>
        <OPTION value="30">30 см.</OPTION>
        <OPTION value="40">40 см.</OPTION>
        <OPTION value="50">50 см.</OPTION>
        <OPTION value="60">60 см.</OPTION>
        <OPTION value="70">70 см.</OPTION>
        <OPTION value="80">80 см.</OPTION>
        <OPTION value="90" style="display: inline-block;">90 см.</OPTION>
        <OPTION value="100" style="display: inline-block;">100 см.</OPTION>
        <OPTION value="110" style="display: inline-block;">110 см.</OPTION>
        <OPTION value="120" style="display: inline-block;">120 см.</OPTION>
        <OPTION value="130" style="display: inline-block;">130 см.</OPTION>
        <OPTION value="140" style="display: inline-block;">140 см.</OPTION>
        <OPTION value="150" style="display: inline-block;">150 см.</OPTION>
        <OPTION value="160" style="display: inline-block;">160 см.</OPTION>
        <OPTION value="170" style="display: inline-block;">170 см.</OPTION>
        <OPTION value="180" style="display: inline-block;">180 см.</OPTION>
        <OPTION value="190" style="display: inline-block;">190 см.</OPTION>
        <OPTION value="200" style="display: inline-block;">200 см.</OPTION>
    </SELECT>
    Стоимость:
    <INPUT value="0" disabled="disabled" type="text" id="PicExtPrice" Size=8>грн.
</FORM>

Не получается реализовать код, чтобы при выборе в первом SELECT с id="width", option с value > 80 - во втором SELECT с id="height" все option с value > 80 прятать. И соответственно наоборот.

$(document).ready(function() {
$("select").on("change", function() {
  var id = $(this).attr('id');
  if ((id == 'height')) {
    if ($("#height option:selected").val() > 80) {
      $("#width option").each(function() {
        if ($(this).val > 80) {
          $(this).hide();
        }
        if ($("#width option:selected").val() > 80) {
          if ($(this).val() == '80') {
            $(this).prop("selected", 'selected');
          }
        }
      });
    } else {
      $("#width option").each(function() {
        $(this).show();
      });
    }
  }
  if ((id == 'width')) {
    if ($("#width option:selected").val() > 80) {
      $("#height option").each(function() {
        if ($(this).val() > 80) {
          $(this).hide();
        }
        if ($("#height option:selected").val() > 80) {
          if ($(this).val() == '80') {
            $(this).prop("selected", 'selected');
          }
        }
      });
    } else {
      $("#height option").each(function() {
        $(this).show();
      });
    }
  }
});
});

Проблема в том, что скрипт работает только для первого селекта, если во втором выбрать значение > 80, то в первом ни один OPTION не будет прятаться.

Answer 1

А, пардон:

  $("#width option").each(function() {
    if ($(this).val > 80) { // missing () after val
READ ALSO
Поиск в тексте конструкции слово1|слово2|слово3 через regExp

Поиск в тексте конструкции слово1|слово2|слово3 через regExp

Как встроить regExp в js для того, чтобы найти в тексте конструкцию слово1|слово2|слово3 и вернуть массив [слово1, слово2, слово3]? Насколько смог...

335
Добавление/Удаления класса active

Добавление/Удаления класса active

Всем привет! Добивался 30 минут попытки удаления и добавления класса active для ссылок. Вроде код правильный, но у меня не переходит на другие...

398
Как в jQuery получить свойство padding без px?

Как в jQuery получить свойство padding без px?

Получаю свойство padding-left так.

461
Как сделать чтобы загрузка файлов не отправлялась сразу на сервер?

Как сделать чтобы загрузка файлов не отправлялась сразу на сервер?

После добавления файлов, они сразу грузятся на сервер. Как исправить.

464