Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Grant Lacey
Grant Lacey
6,103 Points
Posted by Grant Lacey
Grant Lacey
6,103 Points

JavaScript console "Uncaught SyntaxError: Unexpected Token {"

Im just getting started trying to adapt the jQuery lightbox from jQuery basics to my contact page

Im getting this error in the console: "Uncaught SyntaxError: Unexpected Token {"

Im just trying to log the events as I step into this and am stuck. Heres my snippet:

$("#ContactPane p").click(function(){
    var pselect = $(this).attr("p");
    console.log();
});

Any thoughts are appreciated

Nicholas Hebb
Nicholas Hebb
18,872 Points

I don't see what's causing the problem. Is there other code surrounding it that may point to the issue?

Also, as of jQuery 1.6, prop() replaces most uses of attr():

https://forum.jquery.com/topic/please-explain-attr-vs-prop-change-in-1-6

Grant Lacey
Grant Lacey
6,103 Points
Grant Lacey
Grant Lacey
6,103 Points

Nicholas thank you for your reply. I will continue trouble shooting on my own as well. I do want to add that code example download from the video ran fine by itself. Just to test I copy pasted the relevant code into my project and got the same error. During this process I notice that the console is showing the same old code despite multiple revisions. I tried clearing my cache (chrome) and of course refreshing the browser and saving my work.

Do you think this may be an issue?

2 Answers

Nicholas Hebb
Nicholas Hebb
18,872 Points

I couldn't replicate the syntax error. Creating scripts directly in the console is fine for some things, but in this case a standalone HTML file with script might be more helpful for you to debug this issue.

<!DOCTYPE html>
<html>
<head>
  <title>jQuery Sample</title>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
    <div id="ContactPane">
    <p>Paragraph one</p>
    <p>Paragraph two</p>
    <p>Paragraph three</p>
  </div>

    <script type="text/javascript">
    $(document).ready(function() {
      $("#ContactPane p").click(function(){
          // Removed .attr("p") from the following:
          var pselect = $(this);
          console.log("Content: " + pselect.text());
      });
    });
  </script>
</body>
</html>
Grant Lacey
Grant Lacey
6,103 Points
Grant Lacey
Grant Lacey
6,103 Points

Nicholas- I scrapped my code and used your example as a foundation to build on as Im working to learn more. I am sure I omitted or did something quite obvious. That being said your thoughtful reply and effort put in really means a lot. It served to help me maintain momentum and continuing improving. Nudges over speed bumps like this are extremely useful.

Thank you.