Search code examples
jqueryonfocus

Enable / disable Elements When div element gets focus

I've certain number of Input elements inside a div. When any of the input element inside the div gets focus I want disable an element outside the div? How can do this in jquery??

Solution

  • Assuming the following HTML as an example:

    <div class="div">
     <input type="text" />
     <input type="text" /> 
     <input type="text" /> 
</div>

<input type="text" class="b"/>

    One can use the following script, using the focus and blur events:

    $('.div input[type="text"]').on('focus', function(){
    $('.b').prop('disabled', true);

}).on('blur', function(){
     $('.b').prop('disabled', false); 
});

    Check Fiddle