Блог

Главная - Вопросы по программированию - Как проверить второй щелчок флажка?

Как проверить второй щелчок флажка?

#jquery

#jquery

Вопрос:

JS

 $(document).ready(function(){ 
   $('#sale').click(function(){ 
      $('.disabledCheckboxes').prop("disabled", true);
   });
});

HTML

 <div class="form-check">
    <label class="form-check-label">
    <input id="sale" type="checkbox" class="form-check-input">
    <i class="input-frame"></i>
     SALE
     </label>
</div>
<div class="form-check">
    <label class="form-check-label">
    <input id="sale" type="checkbox" class="form-check-input">
    <i class="input-frame"></i>
     NOT SALE
     </label>
</div>

<div class="col-md-4 mt-3">
     <label>INPUT</label>
     <input class="form-control form-control-lg disabledCheckboxes" mask="d0/M0/0000" 
      placeholder="dd/mm/yyyy"/>
</div>

Когда я нажимаю флажок, jquery работает. И идентификатор, который я установил, становится активным. Таким образом, входные данные становятся неэффективными. Но когда я нажимаю его во второй раз, он не активируется. Я новичок в Jquery. Как это должно быть сделано?

Комментарии:

1. У вас не должно быть нескольких элементов с одинаковым идентификатором sale , идентификатор всегда должен оставаться unqiue. Для этого используйте class .

2. это не мой вопрос. Я хочу, чтобы функция была удалена при повторном нажатии флажка

3. Возможно, это не является частью вашего вопроса, но, как правило, следует иметь в виду, что идентификаторы всегда должны оставаться неизменными. Это как иметь 2 человека с одинаковым номером социального страхования.

Ответ №1:

Как я уже говорил в комментариях, идентификатор всегда должен быть уникальным, поэтому иметь 2x id =»продажа» — плохая идея, но для решения вашего вопроса используйте:

 $('.disabledCheckboxes').prop("disabled", this.checked);

ДЕМОНСТРАЦИЯ

 $(document).ready(function() {
  $('#sale').click(function() {
    $('.disabledCheckboxes').prop("disabled", this.checked);
  });
});  
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-check">
  <label class="form-check-label">
    <input id="sale" type="checkbox" class="form-check-input">
    <i class="input-frame"></i>
     SALE
     </label>
</div>
<div class="form-check">
  <label class="form-check-label">
    <input id="sale" type="checkbox" class="form-check-input">
    <i class="input-frame"></i>
     NOT SALE
     </label>
</div>

<div class="col-md-4 mt-3">
  <label>INPUT</label>
  <input class="form-control form-control-lg disabledCheckboxes" mask="d0/M0/0000" placeholder="dd/mm/yyyy" />
</div>