Как выбрать входные элементы в div которые не скрыты? - PullRequest
Новая
       7

Как выбрать входные элементы в div которые не скрыты?

0 голосов
/ 17 февраля 2020

Как выбрать массив элементов input и select, которые не скрыты в приведенной ниже форме, используя jQuery? 

  <form class="FORM_1">
    <div class="a" style="display:inline-block><input id="A"/></div>

    <div class="a" style="display:none"><input id="B"/></div>

    <div class="a"><select id="C"/></div>
    <div class="a"style="display:none"><select id="D"/></div>

    <div class="a style="display:inline-block"><input id="F"/></div>
   </form>

Я пытался с кодом ниже, но это не так работать так, как мне нужно. 

$('.FORM_1 input, .FORM_1 select').prop('display', 'inline-block').each(function(index){  
  var input = $(this);      
  console.log('Type: ' + input.attr('type'));
});

Ответы [ 2 ]

1 голос
/ 17 февраля 2020 

$(".FORM_1 input:visible, .FORM_1 select:visible").each(function(index) {
  var input = $(this);
  console.log("Type: " + input.prop("type"));
});
.a {
  display: inline-block;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form class="FORM_1">
  <div class="a"><input id="A" type="text" />
  </div>

  <div class="a" style="display:none"><input id="B" type="text" /></div>

  <div class="a"><select id="C"></select></div>
  <div class="a" style="display:none"><select id="D"></select></div>

  <div class="a"><input id="F" type="text" /></div>
</form>
1 голос
/ 17 февраля 2020

Используйте is(":visible") для выбора видимых элементов 

$('.FORM_1 input:visible, .FORM_1 select:visible').addClass('YourStuff');

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

input, select {
  display: inline-block;
}

Затем в html

<input style="display: none;" />

Затем в JS

$('.FORM_1 input, .FORM_1 select').show();
...