Is there the opposite of click event in Jquery?

Question

I made a search bar with search icon. I want this, when I click the #forminput, #search will return white; and after I click another object, #search will return lightgray color. How can I do this? My codes:

$(document).ready(function(){
$("#forminput").click(function(){
$("#search").css("color", "white");
});
});

Have a nice day.

You might be able to use CSS based on the focus state of the input. Please include your HTML so that we can see a working demonstration of the code you've got. Thanks! — showdev, Jul 10 '17 at 17:28
@PraveenKumar Maybe I misunderstood, but he says he wants to do something when you click an object other than the search icon. — Barmar, Jul 10 '17 at 17:31

score 0 · Answer 1 · answered Jul 10 '17 at 17:29

0

Yes, you can use off and give the event handler:

$("#forminput").off("click");

But if you want to restore to an earlier state, it is always wise to use just CSS for presentation and then use JavaScript to toggle between the classes. Considering your current situation, I believe just CSS is enough.

input {color: #999; padding: 10px; width: 200px;}
input:focus {color: #000;}

<input type="text" value="Default Gray, Click Black." />

answered Jul 10 '17 at 17:29

Praveen Kumar Purushothaman

164,888
24
203
252

Thanks, I solved this problem. I used focus and blur events. – Ubeyde Emir Özdemir Jul 12 '17 at 09:20
@UbeydeEmirÖzdemir Okay nice to hear. – Praveen Kumar Purushothaman Jul 12 '17 at 09:28

score 0 · Answer 2 · answered Jul 10 '17 at 17:33

0

Here you go with the solution https://jsfiddle.net/8gygvdwy/

$('input[type=text]').focus(function(){
 $(this).css({
   'background': '#ccc'
  });
}).focusout(function(){
 $(this).css({
   'background': '#fff'
  });
});

$('input[type=button]').click( function(){
 $('input[type=text]').css({
   'background': '#fff'
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="search" />
<input type="button" value="Submit" />

answered Jul 10 '17 at 17:33

Shiladitya

12,003
15
25
38

Thanks, I solved this problem. I used focus and blur events. – Ubeyde Emir Özdemir Jul 12 '17 at 09:21
@UbeydeEmirÖzdemir Awesome to hear that :) Please share your code as answer and so that I any one faces the same issue will be able to find the solution. – Shiladitya Jul 12 '17 at 10:20

Is there the opposite of click event in Jquery?

2 Answers2