EDIT**
I have this click event
$('.next-question').click(function () {
$('td').removeClass('highlight-problem');
var r = rndWord;
while (r == rndWord) {
rndWord = Math.floor(Math.random() * (listOfWords.length));
}
$('td[data-word="' + listOfWords[rndWord].name + '"]').addClass('highlight-problem');
$('td[data-word=' + word + ']').removeClass('wrong-letter').removeClass('wrong-word').removeClass('right-letter');
var spellSpace = $('td[data-word=' + listOfWords[rndWord].name + ']').hasClass('right-word');
if (spellSpace) {
$('.next-question').trigger('click');
} else {
$("#hintSound").attr('src', listOfWords[rndWord].audio);
hintSound.play();
$("#hintPic").attr('src', listOfWords[rndWord].pic);
$('#hintPic').show();
$('#hintPicTitle').attr('title', listOfWords[rndWord].hint);
$('#hintPicTitle').show();
}
});
When debug in the console it says too much recursion meaning it is in some sort of endless loop at this point. I think it is because of the trigger("click") event in the if statement, because I seen something similar online.
Basically, I want to say, if given word has the class right-word then move on (hence the trigger), else ...
Is there another way to write it that will not crash?
Here is a fiddle: /
INSTRUCTION: Click the letters on the right to spell the highlighted area in the grid (The images to help you spell the words are not available in a fiddle so you have to spell them using the console, by looking up the td's)
EDIT**
I have this click event
$('.next-question').click(function () {
$('td').removeClass('highlight-problem');
var r = rndWord;
while (r == rndWord) {
rndWord = Math.floor(Math.random() * (listOfWords.length));
}
$('td[data-word="' + listOfWords[rndWord].name + '"]').addClass('highlight-problem');
$('td[data-word=' + word + ']').removeClass('wrong-letter').removeClass('wrong-word').removeClass('right-letter');
var spellSpace = $('td[data-word=' + listOfWords[rndWord].name + ']').hasClass('right-word');
if (spellSpace) {
$('.next-question').trigger('click');
} else {
$("#hintSound").attr('src', listOfWords[rndWord].audio);
hintSound.play();
$("#hintPic").attr('src', listOfWords[rndWord].pic);
$('#hintPic').show();
$('#hintPicTitle').attr('title', listOfWords[rndWord].hint);
$('#hintPicTitle').show();
}
});
When debug in the console it says too much recursion meaning it is in some sort of endless loop at this point. I think it is because of the trigger("click") event in the if statement, because I seen something similar online.
Basically, I want to say, if given word has the class right-word then move on (hence the trigger), else ...
Is there another way to write it that will not crash?
Here is a fiddle: http://jsfiddle/Dxxmh/112/
INSTRUCTION: Click the letters on the right to spell the highlighted area in the grid (The images to help you spell the words are not available in a fiddle so you have to spell them using the console, by looking up the td's)
Share Improve this question edited Nov 13, 2012 at 10:52 Milo-J asked Nov 13, 2012 at 10:22 Milo-JMilo-J 1,1082 gold badges13 silver badges26 bronze badges 6- What do you mean by "move on" ? Are you trying to filter an action defined elsewhere ? – Denys Séguret Commented Nov 13, 2012 at 10:26
-
What is your goal? You are right about
trigger- that is place which can cause recursion. And you must have some mechanism to stop recursion (go to else branch or stop handler exectuion in other way). But it is hard to say how it could be stopped correctly. – Viktor S. Commented Nov 13, 2012 at 10:28 - move on as in keep looping until it finds one without that class @dystroy – Milo-J Commented Nov 13, 2012 at 10:29
- There is no reason for the recursion to end as the condition won't change during the "loop". – Denys Séguret Commented Nov 13, 2012 at 10:31
- And how does trigger should make it move to next word? As I can see - you will always work with the same word. Possibly you can try to make an example on jsfiddle – Viktor S. Commented Nov 13, 2012 at 10:32
4 Answers
Reset to default 2I would do something like this:
if (spellSpace) {
if(score.right != 4)
$('.next-question').trigger('click');
I see like if(score.right == 4) means the end of game. After it is ended - you have no words (or just have no "right" words, not sure) at all and that is why it never stops. It just triggers click forever instead of stop doing anything and wait for user to click Restart button.
I guess that condition is not enough. Not sure how number of wrong words is counted and handled. But it should be enough to move forward and build correct condition based on your programm logic. Any recursion you start (and you start it with trigger("click")) must have a stop condition.
.trigger('click') will just invoke the listener once more. Did you intend to follow the link only in that circumstance? In that case you could return false in your else scenario.
This isn't a jQuery issue: you're manually triggering the same event from within the handler:
$('.next-question').trigger('click');
Now, this will cause an infinite loop if you're not careful. Best way to fix this is not to invoke the handler by triggering the event a second time, but by calling it using a function name:
$('.next-question').click(function callMe(event)
{
//replace: $('.next-question').trigger('click');
//with this:
if (spellSpace && event)
{//also check if the event has been passed
callMe.apply(this,[]);//don't pass event for recursive call
}
});
Try to use this:
$('.next-question').click(function (event) {
event.preventDefault();
});