Вход • Регистрация

Помогите упростить код на JQ

  •
  • 06 августа 2015 г.
  • Приветствую, я только изучаю JS, JQ и вот один простой код который работает, но чувствую он не совсем правильно собран, помогите его упростить или укоротить, и вообще дайте советы по этому поводу, буду очень благодарен

    Код
    $(document).ready(function() {
    $(".fieldlist input[name=payment_id]").change(function() {
    if (this.value == '1') {
    $(".order_form_param4").addClass('hidemy');
    $(".order_form_param5").removeClass('hidemy');
    $(".order_form_param6").removeClass('hidemy');
    $(".order_form_param7").removeClass('hidemy');
    $(".order_form_param9").removeClass('hidemy');
    $(".order_form_param11").addClass('hidemy');
    $(".order_form_param12").removeClass('hidemy');
    $(".order_form_param13").addClass('hidemy');
    $(".order_form_param14").removeClass('hidemy');
    $(".order_form_param1 input[name=p1]").attr("required","");
    $(".order_form_param2 input[name=p2]").attr("required","");
    $(".order_form_param3 input[name=p3]").attr("required","");
    $(".order_form_param4 input[name=p4]").removeAttr("required","");
    $(".order_form_param5 input[name=p5]").attr("required","");
    $(".order_form_param6 input[name=p6]").attr("required","");
    $(".order_form_param7 input[name=p7]").attr("required","");
    $(".order_form_param9 input[name=p9]").attr("required","");
    $(".order_form_param11 input[name=p11]").removeAttr("required","");
    $(".order_form_param12 input[name=p12]").removeAttr("required","");
    $(".order_form_param13 input[name=p13]").attr("required","");
    $(".order_form_param14 input[name=p14]").removeAttr("required","")

    }
    else if (this.value == '2') {
    $(".order_form_param4").addClass('hidemy');
    $(".order_form_param5").addClass('hidemy');
    $(".order_form_param6").addClass('hidemy');
    $(".order_form_param7").addClass('hidemy');
    $(".order_form_param9").addClass('hidemy');
    $(".order_form_param11").addClass('hidemy');
    $(".order_form_param12").addClass('hidemy');
    $(".order_form_param13").addClass('hidemy');
    $(".order_form_param14").addClass('hidemy');
    $(".order_form_param1 input[name=p1]").attr("required","");
    $(".order_form_param2 input[name=p2]").attr("required","");
    $(".order_form_param3 input[name=p3]").attr("required","");
    $(".order_form_param4 input[name=p4]").removeAttr("required","");
    $(".order_form_param5 input[name=p5]").removeAttr("required","");
    $(".order_form_param6 input[name=p6]").removeAttr("required","");
    $(".order_form_param7 input[name=p7]").removeAttr("required","");
    $(".order_form_param9 input[name=p9]").removeAttr("required","");
    $(".order_form_param11 input[name=p11]").removeAttr("required","");
    $(".order_form_param12 input[name=p12]").removeAttr("required","");
    $(".order_form_param13 input[name=p13]").removeAttr("required","");
    $(".order_form_param14 input[name=p14]").removeAttr("required","")

    }
    else if (this.value == '5') {
    $(".order_form_param4").removeClass('hidemy');
    $(".order_form_param5").removeClass('hidemy');
    $(".order_form_param6").removeClass('hidemy');
    $(".order_form_param7").removeClass('hidemy');
    $(".order_form_param9").removeClass('hidemy');
    $(".order_form_param11").removeClass('hidemy');
    $(".order_form_param12").removeClass('hidemy');
    $(".order_form_param13").removeClass('hidemy');
    $(".order_form_param14").addClass('hidemy');
    $(".order_form_param1 input[name=p1]").attr("required","");
    $(".order_form_param2 input[name=p2]").attr("required","");
    $(".order_form_param3 input[name=p3]").attr("required","");
    $(".order_form_param4 input[name=p4]").attr("required","");
    $(".order_form_param5 input[name=p5]").attr("required","");
    $(".order_form_param6 input[name=p6]").attr("required","");
    $(".order_form_param7 input[name=p7]").attr("required","");
    $(".order_form_param9 input[name=p9]").attr("required","");
    $(".order_form_param11 input[name=p11]").attr("required","");
    $(".order_form_param12 input[name=p12]").removeAttr("required","");
    $(".order_form_param13 input[name=p13]").attr("required","");
    $(".order_form_param14 input[name=p14]").removeAttr("required","")

    }
    else if (this.value == '6') {
    $(".order_form_param4").removeClass('hidemy');
    $(".order_form_param5").removeClass('hidemy');
    $(".order_form_param6").removeClass('hidemy');
    $(".order_form_param7").removeClass('hidemy');
    $(".order_form_param9").removeClass('hidemy');
    $(".order_form_param11").removeClass('hidemy');
    $(".order_form_param12").removeClass('hidemy');
    $(".order_form_param13").removeClass('hidemy');
    $(".order_form_param14").addClass('hidemy');
    $(".order_form_param1 input[name=p1]").attr("required","");
    $(".order_form_param2 input[name=p2]").attr("required","");
    $(".order_form_param3 input[name=p3]").attr("required","");
    $(".order_form_param4 input[name=p4]").attr("required","");
    $(".order_form_param5 input[name=p5]").attr("required","");
    $(".order_form_param6 input[name=p6]").attr("required","");
    $(".order_form_param7 input[name=p7]").attr("required","");
    $(".order_form_param9 input[name=p9]").attr("required","");
    $(".order_form_param11 input[name=p11]").attr("required","");
    $(".order_form_param12 input[name=p12]").removeAttr("required","");
    $(".order_form_param13 input[name=p13]").attr("required","");
    $(".order_form_param14 input[name=p14]").removeAttr("required","")

    }
    })
    });
  •
  • 06 августа 2015 г.
  • принцип такой:

    Код
    $(".order_form_param4, .order_form_param11, .order_form_param13").addClass('hidemy');
    $(".order_form_param5, .order_form_param6, .order_form_param7,.order_form_param9, .order_form_param12, .order_form_param14").removeClass('hidemy');
    $(".order_form_param1 input[name=p1], .order_form_param2 input[name=p2], .order_form_param3 input[name=p3], .order_form_param5 input[name=p5], .order_form_param6 input[name=p6], .order_form_param7 input[name=p7], .order_form_param9 input[name=p9],.order_form_param13 input[name=p13]").attr("required","");
    $(".order_form_param4 input[name=p4], .order_form_param11 input[name=p11], .order_form_param12 input[name=p12], .order_form_param14 input[name=p14]").removeAttr("required","");
  •
  • 07 августа 2015 г. , редакция: 07 августа 2015 г.
  • Начать нужно с кеширования селекторов в переменную:

    Код

    var $oP4 = $(".order_form_param4"),
    $oP5 = $(".order_form_param5"),


    Еще лучше будет для контейнера всех этих элементов в css прописать состояния и добавлять ему нужный класс в зависимости от ситуации. Пример на less:
    Код

    .parent.state-one {
    .order_form_param4, .order_form_param5, .order_form_param6 {
    display: none;
    }
    }


    В тех случаях, когда css не обойтись(изменение attr) можно объединить одинаковые элементы классом, например state-three-required и в js обращаться только к нему, в итоге можно сократить до такого(лишнее опущено):

    Код

    var $stateThreeReq = $('.state-three-required'),
    $stateThreeRemoveReq = $('.state-three-remove-required'),
    $paramsContainer = $('.params-container');

    ...

    else if (this.value == '6') {
    $paramsContainer.addClass('state-three')
    $stateThreeReq.attr("required","");
    $stateThreeRemoveReq.removeAttr("required","");
    }

    ...




    А вообще, там где это возможно, отлично использовать что-то из серии AngularJS. Такие задачи решаются сильно проще и симпатичнее.
    •
    • 07 августа 2015 г.
    • можноо перебором попробовать, вот пример

      Код

      $(document).ready(function() {

      $(".cart_orders input").each(function() {
      this_name = $(this).attr("name");
      if(this_name == "p4" || this_name == "p11" || this_name == "p13") {
      $(this).parent().addClass('hidemy');
      }
      if(this_name == "p1"|| this_name == "p2" || this_name == "p3" || this_name == "p5") {
      $(this).attr("required","");
      }
      });

      });

Новости

  • Новая сборка DIAFAN.CMS 7.2.5
  • Вчера, 09:47
  • В преддверии 2025 года была выпущена сборка 7.2.5, которая не приносит радикальных изменений в функциональности, но способствует повышению стабильности работы системы и расширению возможностей облачного сервиса для создания сайтов.
  • Вышла очередная сборка DIAFAN.CMS 7.2.2
  • 18 июня 2024 г.
  • В сборке большое обновление demo-шаблона, дополнительная защита от спама, улучшение YML-импорта и еще много важного и интересного.
  • Не пропустите сборку DIAFAN.CMS 7.1.4
  • 24 апреля 2024 г.
  • В новой сборке совершили революцию в структурировании кастомизированной информации в шаблонах, добавили авторегистрацию пользователей, усовершенствовали защиту от спама, актуализировали накопительную скидку, а также улучшили производительность и стабильность работы системы.
Все новости