指定输入目标模糊功能

Question

My function works as it should. is there a way to remove the function from a specific input? Because it changes all inputs.. i have 2 check boxes and 1 input that i need to not have this function on.

$('input').blur(function(){
    $('input').parent().removeClass("gray");
})
    .focus(function() {     
        $(this).parent().addClass("gray")
});

Answer 1

Try adding a class to the input and checkbox that you don't want the onblur functions, then update the code as below

Add the class to the three inputs that you don't want this feature

$('input').not( ".class" ).blur(function() {
    $(this).parent().removeClass("gray");
  })
  .focus(function() {
    $(this).parent().addClass("gray")
  });

Hope this helps what you need.

Answer 2

Use this context, $('input') will select all the <input> elements, this in the callback will hold the element on which event is invoked!

 $('input').blur(function() { $(this).parent().removeClass("gray"); }) .focus(function() { $(this).parent().addClass("gray") }); 

 .gray { background: gray; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <div> <input type="text"> </div> <div> <input type="text"> </div> 

Answer 3

If you have id's for those three inputs you can use this code snippet.

$('input').blur(function(){
    $(this).parent().removeClass("gray");
 })
.focus(function() {     
    $(this).parent().not( "#id1, #id2, #id3" ).addClass("gray")
 });

It will add class to those inputs which do not match the selector.