THe O Shortcut


#1

So my function is working. When I press O the article opens, but I'm still getting this error message
"Oops, try again. It looks like the o key isn't opening a description. Remember to toggle the current article's description inside the event handler. Look back at the instructions for the code."
Heres my code:

var main = function() {
$('.article').click(function() {
$('.article').removeClass('current');
$('.description').hide();

$(document).keypress(function(event) {
if(event.which === 111) {
$('.current').children('.description').toggle();
}
});

$(this).addClass('current');
$(this).children('.description').show();

});
}

$(document).ready(main);


#2

Hi Rookeryan,

You're closing your $(document).keypress(...); section prematurely there. Remove the second line shown, and your code should work :slightly_smiling:


#3

Ok, I did that. My new code looks like:

var main = function() {
$('.article').click(function() {
$('.article').removeClass('current');
$('.description').hide();

$(document).keypress(function(event) {
if(event.which === 111) {
$('.current').children('.description').toggle();
}

$(this).addClass('current');
$(this).children('.description').show();

});
}

$(document).ready(main);

But I'm getting a new error message now, it says "Uncaught SyntaxError: missing ) after argument list" I'm not sure where the missing ) should go.


#4

@rookeryan OK, now all you need to do is close your $('.article').click(...); part before the rest of your code. Like this:

var main = function() {
  $('.article').click(function() {
    // ...
  }); // ← you're missing this

  $(document).keypress(function() {
    
  });
}

:slightly_smiling:


#5

Thanks I did that. Got another error message though saying "Oops, try again. It looks like the o key isn't opening a description. Remember to toggle the current article's description inside the event handler. Look back at the instructions for the code."

var main = function() {
$('.article').click(function() {
$('.article').removeClass('current');
$('.description').hide();
});

$(document).keypress(function(event) {
if(event.which === 111) {
$('.current').children('.description').toggle();
}

$(this).addClass('current');
$(this).children('.description').show();

}
});

$(document).ready(main);


#6

@rookeryan Oops, I guess I missed something, sorry!
The order of these needs to be reversed:

So it looks like this:

  });
};

#7

Sweet, finally got it to work. Thanks for all the help.