Включить отключенную кнопку «Отправить», если оба поля «Выбрать» и «Поле ввода» имеют значения?

https://developer.mozilla.org/en/CSS/Media_queries#-moz-device-pixel-ratio

-moz-device-pixel -ratio Дает количество пикселей устройства на пиксель CSS.

blockquote>

это почти самоочевидно. число описывает отношение количества «реальных» пикселей (физических пикселов экрана) для отображения одного «виртуального» пикселя (размер устанавливается в CSS).

0
задан Jairellle 27 February 2019 в 17:54
поделиться

2 ответа

Два поля и два события ...

Вы можете написать один «обработчик» для этого. Просто используйте метод .on() , который позволяет связывать много событий (здесь keyup и change). Затем, в сравнении, проверьте оба значения. Если один или другой пуст, отключите кнопку.

$(function() {
  $('#searchInput, #selectBox').on('keyup change',function() {
    if ($('#searchInput').val() == '' || $('#selectBox').val() == '') {
      $('.enableOnInput').prop('disabled', true);
    } else {
      $('.enableOnInput').prop('disabled', false);
    }
  });
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<body>
  <div id='frame'>
    <div class='search'>
      <form method='post'>
        <select id="selectBox" class="selectBox" required>
          <option value="">--Select--</option>
          <option value="Yes">Yes</option>
          <option value="No">No</option>
        </select>
        <input type='text' name='searchQuery' id='searchInput' required/>
        <input type='submit' name='submit' id='submitBtn' class='enableOnInput' disabled='disabled' />
      </form>
    </div>
  </div>
</body>

Это можно даже записать короче, поместив условие непосредственно во второй истинный / ложный аргумент .prop() :

$(function() {
  $('#searchInput, #selectBox').on('keyup change',function() {
    $('.enableOnInput').prop('disabled', ($('#searchInput').val() == '' || $('#selectBox').val() == ''));
  });
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<body>
  <div id='frame'>
    <div class='search'>
      <form method='post'>
        <select id="selectBox" class="selectBox" required>
          <option value="">--Select--</option>
          <option value="Yes">Yes</option>
          <option value="No">No</option>
        </select>
        <input type='text' name='searchQuery' id='searchInput' required/>
        <input type='submit' name='submit' id='submitBtn' class='enableOnInput' disabled='disabled' />
      </form>
    </div>
  </div>
</body>

0
ответ дан Louys Patrice Bessette 27 February 2019 в 17:54
поделиться

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

$('#selectBox','#searchInput').on('change', function() {
 enablingFunction();
 });

function enablingFunction(){
  if($('#selectBox').val() != "" && $('#searchInput').val() != ""){
    $('#submitBtn').prop("disabled", false);
   }
}
0
ответ дан Aditya Narayan Shahi 27 February 2019 в 17:54
поделиться
Другие вопросы по тегам:

Похожие вопросы: