jQuery hasClass Uncaught SyntaxError: Unexpected token )

Question

I got this error in console log but can't determine what's wrong. I would like to hide an element when the button is collapsed

$(".navbar-toggle").click(function() {
if(".navbar-toggle").hasClass("collapsed") 
    $(".country-flags-container").hide();
else   
    $(".country-flags-container").show();
)}

I appreciate your help for my learnings.

For syntax errors in JavaScript, it's simple to use [JS Hint](http://jshint.com/) which will tell you the line numbers of the syntax errors. — David Thomas, Mar 31 '17 at 11:35
You should add one more ) for if statement like if(".navbar-toggle").hasClass("collapsed") ) — Abi, Mar 31 '17 at 11:36
There is only one syntax error in code which is in last.... i.e }) replaced by )}...so why all of giving same type answers... @ Kobe Brayan You can use a good text editor(like sublime) for avoiding syntax errors like this...() — Abhishek Mishra, Mar 31 '17 at 11:40
I will try to use Sublime. I currently using notepad++ @AbhishekMishra — Kobe Bryan, Mar 31 '17 at 11:47

kourouma_coder · Accepted Answer · 2017-03-31T11:40:00.920

3

Try this one :

   $(".navbar-toggle").click(function() {
    if((".navbar-toggle").hasClass("collapsed")) // missing () for if statement
        $(".country-flags-container").hide();
    else   
        $(".country-flags-container").show();
    });// this was the issue

Good luck

edited Mar 31 '17 at 11:40

answered Mar 31 '17 at 11:37

kourouma_coder

1,078
2
13
24

it's not the only issue. spot the other and my downvote becomes an upvote. – Jonas Grumann Mar 31 '17 at 11:38
1

I gave you the upvote anyway, your answer combined with the other answers will get the op to solve it. - edit - you found it ;) – Jonas Grumann Mar 31 '17 at 11:39
1

Thank you so much @lazy_coder! Appreciated it a lot! – Kobe Bryan Mar 31 '17 at 11:45
1

@KobeBryan can you please accept the answer so he gets the points? – Jonas Grumann Mar 31 '17 at 12:09

kanzari · Answer 2 · 2017-03-31T11:40:08.483

1

You are using this code :

if(".navbar-toggle").hasClass("collapsed")

and

".navbar-toggle"

is not a selector, also if you use this :

$(".navbar-toggle")

it return an array of elements having class 'navbar-toggle'

try this :

$(".navbar-toggle").click(function() {
if( $(this).hasClass("collapsed") )
    $(".country-flags-container").hide();
else   
    $(".country-flags-container").show();
)}

also you have to think about removing the "collapsed" class after checking it, it's a flag ;)

edited Mar 31 '17 at 11:40

answered Mar 31 '17 at 11:35

kanzari

87
4

At the very least take the time to explain what the problem was, and the changes you made. – David Thomas Mar 31 '17 at 11:36
sorry, i changed : if(".navbar-toggle").hasClass("collapsed") by if( $(this).hasClass("collapsed") ) – kanzari Mar 31 '17 at 11:38
Please edit your answer to include the explanation where it's likely to be read., which also allows code to be readable and offers more space for a coherent, formatted presentation. – David Thomas Mar 31 '17 at 11:42
Thank you so much @kanzari and @DavidThomas! – Kobe Bryan Mar 31 '17 at 11:44
@Kobe, happy coding! – kourouma_coder Mar 31 '17 at 11:47

Muhammad Qasim · Answer 3 · 2017-03-31T11:37:39.580

1

Because you are missing brackets for if condition. You also missed $ from (".navbar-toggle"). This should be $(".navbar-toggle"). Please try the following:

$(".navbar-toggle").click(function() {
   if($(".navbar-toggle").hasClass("collapsed")){ 
      $(".country-flags-container").hide();
   }
   else{   
      $(".country-flags-container").show();
   }
});

You can replace $(".navbar-toggle").hasClass("collapsed") by the following as well:

$(this).hasClass("collapsed")

edited Mar 31 '17 at 11:37

answered Mar 31 '17 at 11:36

Muhammad Qasim

1,622
14
26

http://stackoverflow.com/questions/4797286/are-curly-braces-necessary-in-one-line-statements-in-javascript so only the missing ) is an error. – Jonas Grumann Mar 31 '17 at 11:37
Thank you so much @Muhammad Qasim! Appreciated it a lot! – Kobe Bryan Mar 31 '17 at 11:45

score 1 · Answer 4 · answered Mar 31 '17 at 11:37

1

 $(".navbar-toggle").click(function() {
   if(".navbar-toggle").hasClass("collapsed")) 
    $(".country-flags-container").hide();
  else   
    $(".country-flags-container").show();
  )}

Try this You miss the ) for if condition

answered Mar 31 '17 at 11:37

Abi

724
6
22

Thank you so much @Abi! Appreciated it a lot! – Kobe Bryan Mar 31 '17 at 11:45

jQuery hasClass Uncaught SyntaxError: Unexpected token )

4 Answers4