Динамически включить/отключить опцию выбора на основе записи на поле ввода

Question

Я хочу помочь мне, мне нужна функция, когда значение ввода в новом домене отключает домен и частный список. также когда входное значение в new-private отключает частный список.

<h4>domain finder</h4> 
<form action="test.php" method="POST"> 
    <select class="step1" name="domain"> 
     <option value="">Select a general domain</option> 
    </select> 
    <select class="step2" name="private"> 
     <option value="">Select a private area</option> 
    </select> 
    <label for="new-domain">other general domain</label> 
    <input type="text" name="new-domain"></input> 
    <label for="new-private">other private area</label> 
    <input type="text" name="new-private"></input> 
    <button>Submit</button> 
</form> 

Answer 1

Думаю, я понимаю, о чем вы просите. Подводя итог:

1. Если в поле ввода new-domain есть какой-либо вход, вы хотите отключить оба элемента выбора.
2. Когда в поле new-private есть вход, вы хотите отключить только закрытый список.

Если это правильно, я установил для вас Fiddle!

$(function() { 
 
\t $('#new-domain').on('keyup', function() { 
 
    \t // Disable both select elements. 
 
    var inputLength = $(this).val().length; 
 
    var $elements = $('.step1, .step2'); 
 
    
 
    if (inputLength > 0) { 
 
    \t disableSelectElements($elements, true) 
 
    } else { 
 
    \t disableSelectElements($elements, false) 
 
    } 
 
    }); 
 
    
 
    $('#new-private').on('keyup', function() { 
 
    \t // Disable just the private list. 
 
    var inputLength = $(this).val().length; 
 
    var $elements = $('.step2'); 
 
    
 
    if (inputLength > 0) { 
 
    \t disableSelectElements($elements, true) 
 
    } else { 
 
    \t disableSelectElements($elements, false) 
 
    } 
 
    }); 
 
}) 
 

 
var disableSelectElements = function($elements, onOrOff) { 
 
\t $elements.prop('disabled', onOrOff); 
 
};

<h4>domain finder</h4> 
 
<form action="test.php" method="POST"> 
 
    <select class="step1" name="domain"> 
 
     <option value="">Select a general domain</option> 
 
    </select> 
 
    <select class="step2" name="private"> 
 
     <option value="">Select a private area</option> 
 
    </select> 
 
    <label for="new-domain">other general domain</label> 
 
    <input type="text" name="new-domain" id="new-domain" /> 
 
    <label for="new-private">other private area</label> 
 
    <input type="text" name="new-private" id="new-private" /> 
 
    <button>Submit</button> 
 
</form>

По сути то, что я делаю прикрепляет слушателей для успешного ввода в нажатие клавиши оба эти поля ввода и отключение или повторное включение полей ввода по мере необходимости. Я проверяю длину, чтобы убедиться, что в текстовом поле есть что-то (на случай, если кто-то напечатает письмо, а затем удалит его) и ответьте соответствующим образом.

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

Answer 2

Использовать on ("input") из jquery?

$('DOMELEMENT').on('input', function() { 
    $(this).checkvalue --> disable/enable. 
}); 

Довольно уверен, что это работает, если не продолжать поиск в jQuery при изменении ввода текста, удачи.