Как можно убрать событие при клике на input?

113
21 августа 2021, 05:10

Сейчас при клике на инпут срабатывает ajax событие, а мне надо что бы срабатывало, после ввода в инпут кол-ва товара!

$(document).on('click change submit','[data-action]',function(){ 
        var action = $(this).attr('data-action'); 
		var cardClose = this.getAttribute("data-cardClose"); 
        var $this = $(this); 
        var data = {}; 
        data['action'] = action; 
        switch (action){ 
            case 'updatebasket': 
                data['id'] = $this.attr('data-id'); 
                data['quantity'] = $('.dds_basket_quantity-'+data['id']).val(); 
                break; 
            case 'delete': 
                data['id'] = $this.attr('data-id'); 
                break; 
        }
/* added */ 
.goodsOrderItemsWrap { 
  width: 97%; 
  position: relative; 
  margin-bottom: 40px; } 
  @media (min-width: 576px) { 
    .goodsOrderItemsWrap { 
      margin-bottom: 40px; } } 
  @media (min-width: 768px) { 
    .goodsOrderItemsWrap { 
      margin-bottom: 40px; } } 
  @media (min-width: 1200px) { 
    .goodsOrderItemsWrap { 
      margin-top: 25px; 
      margin-bottom: 60px; } } 
 
.goodsOrderList { 
  list-style-type: none; 
  margin: 0; 
  padding: 0; } 
  .goodsOrderList li { 
    display: block; 
    margin-bottom: 2px; } 
    .goodsOrderList li:last-child { 
      margin-bottom: 0; 
      border-bottom: none; } 
      .goodsOrderList li:last-child:after { 
        display: none; 
        content: ""; 
        position: absolute; 
        width: 100%; 
        bottom: 0; 
        left: 0; 
        -webkit-transform: translate(-212px, 0); 
                transform: translate(-212px, 0); 
        border-bottom: 2px solid #F7F9FA; } 
        @media (min-width: 1200px) { 
          .goodsOrderList li:last-child:after { 
            display: block; 
            -webkit-transform: translate(-148px, 0); 
                    transform: translate(-148px, 0); } } 
        @media (min-width: 1695px) { 
          .goodsOrderList li:last-child:after { 
            -webkit-transform: translate(-212px, 0); 
                    transform: translate(-212px, 0); } } 
 
.goodsOrderWrap { 
  position: relative; 
  width: 300px; 
  margin-left: auto; 
  margin-right: auto; 
  border-bottom: 2px solid #F7F9FA; 
  padding-top: 22px; 
  padding-bottom: 22px; 
  background: #FFFFFF; } 
  @media (min-width: 576px) { 
    .goodsOrderWrap { 
      width: 100%; 
      margin-left: 10px; 
      margin-right: 0; } } 
  @media (min-width: 768px) { 
    .goodsOrderWrap { 
      margin-left: 20px; } } 
  @media (min-width: 1200px) { 
    .goodsOrderWrap { 
      margin-left: 0; } } 
 
.goodsOrderImg { 
  display: inline-block; 
  vertical-align: middle; 
  text-align: center; 
  width: 116px; 
  height: 116px; 
  margin-bottom: 20px; 
  margin-left: 10px; } 
  .goodsOrderImg img { 
    max-width: 100%; 
    max-height: 100%; 
    height: auto; 
    width: auto; } 
  @media (min-width: 576px) { 
    .goodsOrderImg { 
      margin-bottom: 0; 
      margin-left: 0; } } 
  @media (min-width: 768px) { 
    .goodsOrderImg { 
      width: 24%; } } 
  @media (min-width: 1200px) { 
    .goodsOrderImg { 
      width: 158px; } } 
 
.goodsOrderText { 
  display: inline-block; 
  width: 95%; 
  vertical-align: top; 
  margin-left: 12px; 
  margin-bottom: 20px; 
  font-family: "Panton Bold"; 
  line-height: 29px; 
  font-size: 20px; 
  letter-spacing: 0.06em; 
  color: #3B3B3B; } 
  @media (min-width: 576px) { 
    .goodsOrderText { 
      width: 80%; 
      margin-left: 28px; 
      vertical-align: middle; } } 
  @media (min-width: 768px) { 
    .goodsOrderText { 
      width: 80%; 
      margin-bottom: 20px; 
      margin-top: 0px; } } 
  @media (min-width: 1200px) { 
    .goodsOrderText { 
      vertical-align: middle; 
      width: 80%; 
      margin-bottom: 20px; 
      margin-top: 0px; } } 
  @media (min-width: 1695px) { 
    .goodsOrderText { 
      width: 30%; 
      margin-bottom: 0; } } 
 
.goodsOrderPrice { 
  display: inline-block; 
  position: relative; 
  width: 50%; 
  top: 0; 
  left: 0; 
  vertical-align: top; 
  margin-left: 10px; } 
  @media (min-width: 576px) { 
    .goodsOrderPrice { 
      width: 40%; 
      top: 0; 
      left: 0; 
      margin-left: 55px; 
      margin-bottom: 0; } } 
  @media (min-width: 768px) { 
    .goodsOrderPrice { 
      position: relative; 
      width: 35%; 
      top: 0; 
      left: 0; 
      margin-left: 55px; } } 
  @media (min-width: 1200px) { 
    .goodsOrderPrice { 
      position: relative; 
      width: 35%; 
      top: 0; 
      margin-left: 55px; } } 
  @media (min-width: 1695px) { 
    .goodsOrderPrice { 
      position: relative; 
      margin-left: 65px; 
      width: 32%; 
      top: 0; 
      left: 0; } } 
 
.goodsOrderPriceCount, .goodsOrderPriceRub { 
  font-family: "Panton Bold"; 
  line-height: 29px; 
  font-size: 20px; 
  letter-spacing: 0.06em; 
  color: #3B3B3B; } 
 
.goodsOrderPriceSum { 
  display: block; 
  ffont-family: "Roboto"; 
  font-style: normal; 
  font-weight: normal; 
  line-height: 23px; 
  font-size: 16px; 
  letter-spacing: 0.05em; 
  color: #3B3B3B; } 
 
.goodsOrderPriceSumCount { 
  font-family: "Roboto"; 
  font-style: normal; 
  font-weight: normal; 
  line-height: 22px; 
  font-size: 16px; 
  color: #3B3B3B; } 
 
 
.goodsOrderBlock-wrap { 
  position: relative; 
  width: 80%; 
  margin-left: 40px; } 
  @media (min-width: 1200px) { 
    .goodsOrderBlock-wrap { 
      margin-bottom: 43px; } } 
  .goodsOrderBlock-wrap label { 
    display: block; 
    margin-bottom: 10px; 
    font-family: "Roboto"; 
    font-style: normal; 
    font-weight: normal !important; 
    line-height: normal; 
    font-size: 16px !important; 
    letter-spacing: 0.05em; 
    color: #4F4F4F !important; } 
 
.goodsOrderBlock__title { 
  margin-bottom: 30px; 
  font-family: "Panton Bold"; 
  line-height: 39px; 
  font-size: 40px; 
  letter-spacing: 0.04em; 
  color: #4F4F4F; } 
 
.goodsOrderBlock-input-wrap { 
  position: relative; } 
 
.goodsOrderBlock-input-item:after { 
  position: absolute; 
  content: url("../img/svg-static/search_icon_small.svg"); 
  width: 20px; 
  height: 20px; 
  top: 40px; 
  right: 10px; } 
 
.goodsOrderBlock-input { 
  position: relative; 
  width: 100%; 
  padding-top: 10px; 
  padding-left: 14px; 
  padding-right: 14px; 
  padding-bottom: 10px; 
  margin-bottom: 17px; 
  background: #FFFFFF; 
  border: 1px solid #E0E0E0; 
  box-sizing: border-box; 
  border-radius: 4px; 
  outline: none; 
  font-family: "Roboto"; 
  font-style: normal; 
  font-weight: normal; 
  line-height: normal; 
  font-size: 16px; 
  letter-spacing: 0.05em; } 
  .goodsOrderBlock-input:hover { 
    transition: .6s; 
    border: 1px solid #80BAB6; } 
  .goodsOrderBlock-input:focus { 
    border: 1px solid #80BAB6; } 
 
.goodsOrderBlock__delivery-wrap, .goodsOrderBlock__payment-wrap { 
  position: relative; 
  margin-bottom: 40px; } 
 
.goodsOrderBlock-choice_list { 
  position: relative; 
  list-style-type: none; 
  margin: 0; 
  padding: 0; 
  margin-bottom: 40px; } 
  .goodsOrderBlock-choice_list li { 
    display: inline-block; } 
 
.goodsOrderBlock-choice_item { 
  display: block; 
  position: relative; 
  width: 230px; 
  height: 110px; 
  background: #F7F9FA; 
  border: 3px solid transparent; } 
  @media (min-width: 576px) { 
    .goodsOrderBlock-choice_item { 
      width: 368px; } } 
  .goodsOrderBlock-choice_item:hover, .goodsOrderBlock-choice_item:active, .goodsOrderBlock-choice_item:focus { 
    z-index: 1; 
    transition: .6s; 
    cursor: pointer; 
    background: #FFF; 
    border: 3px solid #56A59E; 
    box-shadow: 0px 45px 85px rgba(0, 0, 0, 0.05); } 
 
.goodsOrderBlock-choice_item-delivery--act, .goodsOrderBlock-choice_item-payment--act { 
  background: #FFF; 
  border: 3px solid #56A59E !important; 
  box-shadow: 0px 45px 85px rgba(0, 0, 0, 0.05); 
  z-index: 1; } 
 
.goodsOrderBlock-choice_item-inner { 
  display: table; 
  width: 70%; 
  position: absolute; 
  top: 50%; 
  left: 50%; 
  -webkit-transform: translate(-50%, -50%); 
          transform: translate(-50%, -50%); } 
 
.goodsOrderBlock-choice_item-img { 
  display: table-cell; 
  width: 30%; 
  vertical-align: middle; } 
 
.goodsOrderBlock-choice_item-img__img1 { 
  background: url("../img/svg-sprites/sprite.svg") no-repeat; 
  background-position: 0 11.267605633802816%; 
  width: 58px; 
  height: 63px; } 
 
.goodsOrderBlock-choice_item-img__img2 { 
  background: url("../img/svg-sprites/sprite.svg") no-repeat; 
  background-position: 0 22.202797202797203%; 
  width: 59px; 
  height: 59px; } 
 
.goodsOrderBlock-choice_item-img__img3 { 
  background: url("../img/svg-sprites/sprite.svg") no-repeat; 
  background-position: 0 32.804232804232804%; 
  width: 60px; 
  height: 64px; } 
 
.goodsOrderBlock-choice_item-text { 
  display: table-cell; 
  vertical-align: middle; 
  padding-left: 10px; 
  font-family: "Roboto"; 
  font-style: normal; 
  font-weight: normal; 
  line-height: 23px; 
  font-size: 16px; 
  letter-spacing: 0.05em; 
  color: #4F4F4F; } 
  @media (min-width: 576px) { 
    .goodsOrderBlock-choice_item-text { 
      padding-left: 0; } } 
 
.goodsOrderBlock-inf_block { 
  position: relative; 
  width: 100%; 
  border: 2px solid #A6ADC0; 
  padding-top: 17px; 
  padding-left: 26px; 
  padding-right: 26px; 
  padding-bottom: 21px; } 
  .goodsOrderBlock-inf_block:after { 
    position: absolute; 
    top: 0; 
    right: 0; 
    content: ""; 
    width: 26px; 
    height: 26px; 
    border-left: 2px solid #A6ADC0; 
    border-bottom: 2px solid #A6ADC0; } 
  .goodsOrderBlock-inf_block:before { 
    position: absolute; 
    top: 0; 
    left: 100%; 
    -webkit-transform: translate(-22px, -10px) rotate(45deg); 
            transform: translate(-22px, -10px) rotate(45deg); 
    content: ""; 
    width: 37px; 
    height: 26px; 
    background: #fff; 
    border-bottom: 2px solid #A6ADC0; } 
 
.goodsOrderBlock-inf_block-left { 
  display: inline-block; 
  width: 100%; 
  vertical-align: top; 
  margin-bottom: 20px; } 
  @media (min-width: 768px) { 
    .goodsOrderBlock-inf_block-left { 
      width: 45%; 
      margin-bottom: 0; } } 
 
.goodsOrderBlock-inf_block-right { 
  display: inline-block; 
  width: 100%; 
  margin-left: 0; 
  vertical-align: top; } 
  @media (min-width: 768px) { 
    .goodsOrderBlock-inf_block-right { 
      width: 50%; 
      margin-left: 15px; } } 
 
.goodsOrderBlock-inf_block__title { 
  font-family: "Roboto"; 
  font-style: normal; 
  font-weight: bold; 
  line-height: 23px; 
  font-size: 16px; 
  letter-spacing: 0.05em; 
  color: #747B8E; } 
 
.goodsOrderBlock-inf_block__list { 
  position: relative; 
  list-style-type: none; 
  margin: 0; 
  padding: 0; } 
  .goodsOrderBlock-inf_block__list li { 
    display: block; 
    font-family: "Roboto"; 
    font-style: normal; 
    font-weight: normal; 
    line-height: 23px; 
    font-size: 16px; 
    letter-spacing: 0.05em; 
    color: #747B8E; } 
 
.goodsOrderBlock-btn { 
  margin-top: 40px; 
  margin-bottom: 20px; } 
 
.goodsOrderBlock-input::-webkit-input-placeholder { 
  font-family: "Roboto"; 
  font-style: normal; 
  font-weight: normal; 
  line-height: normal; 
  font-size: 16px; 
  letter-spacing: 0.05em; 
  color: #E0E0E0; } 
 
.goodsOrderBlock-input:-ms-input-placeholder { 
  font-family: "Roboto"; 
  font-style: normal; 
  font-weight: normal; 
  line-height: normal; 
  font-size: 16px; 
  letter-spacing: 0.05em; 
  color: #E0E0E0; } 
 
.goodsOrderBlock-input::-ms-input-placeholder { 
  font-family: "Roboto"; 
  font-style: normal; 
  font-weight: normal; 
  line-height: normal; 
  font-size: 16px; 
  letter-spacing: 0.05em; 
  color: #E0E0E0; } 
 
.goodsOrderBlock-input::placeholder { 
  font-family: "Roboto"; 
  font-style: normal; 
  font-weight: normal; 
  line-height: normal; 
  font-size: 16px; 
  letter-spacing: 0.05em; 
  color: #E0E0E0; } 
 
.goodsOrderItemsWrap--lk { 
  width: 100%; 
  position: relative; 
  margin-bottom: 40px; } 
  @media (min-width: 576px) { 
    .goodsOrderItemsWrap--lk { 
      margin-bottom: 40px; } } 
  @media (min-width: 768px) { 
    .goodsOrderItemsWrap--lk { 
      margin-bottom: 40px; } } 
  @media (min-width: 1200px) { 
    .goodsOrderItemsWrap--lk { 
      margin-top: 0; 
      margin-bottom: 60px; } } 
 
.goodsOrderWrap--lk { 
  width: 280px; } 
  @media (min-width: 576px) { 
    .goodsOrderWrap--lk { 
      width: 100%; } } 
  .goodsOrderWrap--lk:after { 
    content: ""; 
    position: absolute; 
    width: 100%; 
    top: 100%; 
    left: -26px; 
    border-bottom: 2px solid #F7F9FA; } 
    @media (min-width: 576px) { 
      .goodsOrderWrap--lk:after { 
        left: -26px; } } 
    @media (min-width: 768px) { 
      .goodsOrderWrap--lk:after { 
        left: -26px; } } 
    @media (min-width: 1200px) { 
      .goodsOrderWrap--lk:after { 
        left: -26px; } } 
    @media (min-width: 1695px) { 
      .goodsOrderWrap--lk:after { 
        left: -62px; } } 
 
.goodsOrderList--lk li:last-child:after { 
  display: none; } 
 
.goodsOrderPrice--lk { 
  display: inline-block; 
  width: 35%; 
  position: relative; 
  left: 14%; 
  top: 0; 
  margin-bottom: 0; } 
  @media (min-width: 576px) { 
    .goodsOrderPrice--lk { 
      left: 29%; 
      width: 25%; } } 
  @media (min-width: 768px) { 
    .goodsOrderPrice--lk { 
      position: absolute; 
      width: 20%; 
      left: 455px; 
      top: 66%; } } 
  @media (min-width: 1200px) { 
    .goodsOrderPrice--lk { 
      width: 14%; 
      left: 70%; } } 
  @media (min-width: 1695px) { 
    .goodsOrderPrice--lk { 
      position: relative; 
      width: 14%; 
      left: 0; 
      top: 0; 
      vertical-align: middle; } } 
 
.goodsOrderImg--lk { 
  margin-bottom: 15px; } 
  @media (min-width: 768px) { 
    .goodsOrderImg--lk { 
      margin-bottom: 0; } } 
 
.goodsOrderText--lk { 
  display: block; 
  width: 95%; 
  margin-bottom: 10px; } 
  @media (min-width: 576px) { 
    .goodsOrderText--lk { 
      width: 90%; } } 
  @media (min-width: 768px) { 
    .goodsOrderText--lk { 
      display: inline-block; 
      width: 65%; 
      margin-bottom: 0; } } 
  @media (min-width: 1200px) { 
    .goodsOrderText--lk { 
      width: 65%; } } 
  @media (min-width: 1695px) { 
    .goodsOrderText--lk { 
      width: 34%; } } 
 
.goodsOrder-inner { 
  display: inline-block; 
  position: relative; 
  vertical-align: middle; 
  width: 100%; } 
  @media (min-width: 576px) { 
    .goodsOrder-inner { 
      width: 74%; } } 
  @media (min-width: 768px) { 
    .goodsOrder-inner { 
      width: 74%; } } 
  @media (min-width: 1200px) { 
    .goodsOrder-inner { 
      width: 74%; } } 
  @media (min-width: 1695px) { 
    .goodsOrder-inner { 
      /*width: 82%;*/ } } 
 
.goodsOrder-right { 
  display: inline-block; 
  position: relative; 
  width: 100%; } 
  @media (min-width: 576px) { 
    .goodsOrder-right { 
      width: 100%; } } 
  @media (min-width: 768px) { 
    .goodsOrder-right { 
      width: 90%; } } 
  @media (min-width: 1200px) { 
    .goodsOrder-right { 
      width: 95%; } } 
  @media (min-width: 1695px) { 
    .goodsOrder-right { 
      width: 65%; } }
<div class="goodsOrder goodsOrderWrap js-goodsOrder cardClose cardClose386"> 
								<div class="goodsOrderImg"> 
																			<img src="/local/templates/onion_shop/img/empty.png" alt="image"> 
																	</div> 
								<div class="goodsOrder-inner"> 
									<div class="goodsOrderText"> 
									   Салфетки ONION 30х30см спанлейс 40гр/м2 БЕЛЫЕ 100шт/упак									</div> 
									 
									<div class="goodsOrder-right"> 
										<div class="goodsCounter goodsCounterWrap js-goodsCounter"> 
											<button class="goodsCounterLeft js-goodsCounterLeft" data-id="386" data-prcard="inputPrCard1" data-localsum="localSum1" data-localres="localRes1"><span>-</span></button> 
											<button class="goodsCounterRight js-goodsCounterRight" data-id="386" data-prcard="inputPrCard1" data-localsum="localSum1" data-localres="localRes1"><span>+</span></button> 
											<input class="inputPrCard1 cardActive1 dds_basket_quantity-386" data-action="updatebasket" data-order="Y" data-id="386" data-localsum="localSum1" data-localres="localRes1" type="text" value="1"> 
										</div> 
 
										<div class="goodsOrderPrice "> 
											<span class="goodsOrderPriceCount js-goodsOrderPriceCount localSum1">185</span> 
											<span class="goodsOrderPriceRub">₽</span> 
											<div class="goodsOrderPriceSum"> 
												<span>Итого</span>	 
												<pre style="display:none">																								</pre> 
												<span class="goodsOrderPriceSumCount localRes1">185</span> 
												<span class="goodsOrderPriceSumCountRub">₽</span> 
											</div> 
										</div> 
 
									</div>									 
								 
								</div> 
								<button class="goodsOrderBtn btnClose js-goodsOrderBtn" data-id="386" data-action="delete" data-cardclose="cardClose386" data-cardactive="cardActive1"></button> 
							</div>

текст курсивом

Answer 1

Добавьте условие для события по клику click change submit - через if -> если input.val не равен пустому значению, то выполнение (ajax), если нет - то ничего либо вывод напоминания о введении инфо.

READ ALSO
Ajax простой пример
javascript

Ajax простой пример

Здравствуйте я только начал изучать AJAx нашел в сети простой пример потренироваться, но он почему-то не работает, хотя сделал один в один, не могли...

 111
owl carousel тормозит в safari
javascript

owl carousel тормозит в safari

На главной странице https://nikaestateru/ есть карусель изображений

 239
Превратить в объект с элементами
javascript

Превратить в объект с элементами

Есть код, надо переписать его в объект чтобы потом по нему пробегать циклом и вызывать selectItemКакой он должен иметь вид

 79
SVG Как зациклить анимацию волн
CSS

SVG Как зациклить анимацию волн

 303