Javascript / jQuery newbie error with mouseenter event causing syntax error

I try to apply the style when the mouseenter event mouseenter , but if I uncomment the next untouched selector, even the document is ready to go.

 <body> <div id="1" class="button untouched"></div> <script src="/jquery.js"></script> <script> $(document).ready(function(){ alert("JQuery is working"); }); /* $(".untouched").mouseenter($function(){ $(this).addClass("touched"); }); */ </script> </body> 

I am following an example found at:

http://api.jquery.com/mouseenter/

And I get the following error in Firebug :

 missing ) after argument list [Break On This Error] $(".untouched").mouseenter($function(){ 

Since this does not work, I made a mistake, but I do not know what. All I know is that none of my codes work if I let this run. I downloaded the latest version of jQuery version 1.7.2, which, as I know, is available on the page because alert() working with another comment.

+4
source share
4 answers

In your script, the $(".untouched") should be inside the ready function. Moreover,

mouseenter($function(){ The $ mouseenter($function(){ .

Your last script should look like this:

 $(document).ready(function(){ alert("JQuery is working"); $(".untouched").mouseenter(function(){ $(this).addClass("touched"); }); }); 
+2
source

No $ is required before the function. In addition, the mouseenter event function code must be inside the document.

 <script> $(document).ready(function(){ alert("JQuery is working"); $(".untouched").mouseenter(function(){ $(this).addClass("touched"); }); }); </script> 
+4
source

You have an extra $ , which you shouldn't have before the word function . You probably also want to remove the untouched class:

 $(".untouched").mouseenter(function(){ $(this).removeClass("untouched").addClass("touched"); }); 
+2
source

You can easily do this right from css

  .untouched { background: green; } .untouched :hover { background: blue } 

In jQuery, if you want to use .mouseover, you will need functions - one for when you hover the mouse, and one for when the mouse is not over. It is easier in css, there is only a filter: hover

  $('.untouched').mouseover(function() { $(this).addClass('touched'); }); $('.untuoched').mouseout(function() { $(this).removeClass('touched'); }); 
+1
source

All Articles