Выбирать детей из optgroup только по тегу click - PullRequest
Новая
       26

Выбирать детей из optgroup только по тегу click

0 голосов
/ 12 июня 2019

Я пытаюсь использовать метку optgroup, чтобы выбрать все опции в группе.

Это работает нормально, однако, когда я также выбираю группу <option>, она выбирает все optgroup элементы. Как мне сделать так, чтобы выбор основывался только на теге optgroup? 

$(document).ready(function() {
  $("optgroup").on("click", function() {
    $(this).children("option").prop("selected", true);
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
  <optgroup label="Group1">
    <option value="11">Option 1</option>
    <option value="12">Option 2</option>
  </optgroup>
  <optgroup label="Group2">
    <option value="21">Option 1</option>
    <option value="22">Option 2</option>
  </optgroup>
</select>

1 Ответ

0 голосов
/ 12 июня 2019

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

$(document).ready(function() {
  $("optgroup").on("click", function(e) {
    if(e.target.tagName === 'OPTGROUP'){
      $(this).children("option").each(function(){
        this.selected = !this.selected;
      });
    }
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select multiple size=6>
  <optgroup label="Group1">
    <option value="11">Option 1</option>
    <option value="12">Option 2</option>
  </optgroup>
  <optgroup label="Group2">
    <option value="21">Option 1</option>
    <option value="22">Option 2</option>
  </optgroup>
</select>
...