jQuery keyup event increase-"function" will set to 0

Question

I've three input fields to "search" a JSON tree. If all three fields are filled and correct get the data from next JSON level.

I count up a number through the keyup-event to get next data of a JSON tree. But every time all three fields are filled the counter will reseted.

HTML

<h1>sein</h1>
<form>
    <input type="text" id=simple_present placeholder="simple present">
    <input type="text" id=simple_past placeholder="simple past">
    <input type="text" id=past_participle placeholder="past participle">
</form>
<div class="answer">Enter: be - was - been</div>

JS

$('input').on('keyup', function() {
    var count = 0;

    if (this.value === json.verbs.irregular[count++][this.id]) {
        $(this).prop('disabled', true).next().focus();
    }

    if ($('input:not(:disabled)').length === 0) {
        $('input').val('').prop('disabled', false).first().focus();
        $('h1').text(json.verbs.irregular[count++].infinitiv);
        alert(count);
    }
});

Perhaps the variable will set to 0 on each key-event? But I cant set it outside the keyup-event!

Here is a demonstration of what I've done so far.

Just type:

be
was
been

Any ideas?

[Try this](http://jsfiddle.net/NnAMu/10/) and let me know if this is what u want. — The Alpha, Aug 25 '12 at 17:54
What do the `count++` expressions represent? To me it seems you're incrementing `count` without a reason. — pimvdb, Aug 25 '12 at 17:56

The Alpha · Accepted Answer · 2012-08-25T19:00:36.033

2

You may try this

var count = 0, amount = json.verbs.irregular.length-1, current = 0,
inputs = $("#simple_present, #simple_past, #past_participle");

$(inputs).on('keyup', function() {
    if (this.value === json.verbs.irregular[count][this.id]) {
        $(this).prop('disabled', true).next().focus();
    }

    if ($('input:not(:disabled)').length === 0) {
        $('input').val('').prop('disabled', false).first().focus();
        if(current < amount) { 
            current++; count++; 
        }
        else {
            current=0; count=0; 
        }
        $('h1').text(json.verbs.irregular[current].infinitiv);
    }
});

DEMO.

edited Aug 25 '12 at 19:00

answered Aug 25 '12 at 18:00

The Alpha

143,660
29
287
307

But the problem is, that the title will not changed now! – yckart Aug 25 '12 at 18:01
[Try this](http://jsfiddle.net/NnAMu/11/), it's working. What do you expect here? – The Alpha Aug 25 '12 at 18:04
**[This](http://jsfiddle.net/NnAMu/10/)** works well, but the title (`h1`) will not changed lik [here](http://jsfiddle.net/ARTsinn/NnAMu/) – yckart Aug 25 '12 at 18:06
`$('h1').text(json.verbs.irregular[count].infinitiv);` is `sein`, so, it's always `sein`. – The Alpha Aug 25 '12 at 18:09
`$('h1').text(json.verbs.irregular[count++].infinitiv);` sets the new title in my demonstration ;). But i think @fantactuka has done this job for now! But by the way: THANKS alot so far :-* – yckart Aug 25 '12 at 18:11
@yckart, just check the updated answer, [it's better](http://jsfiddle.net/NnAMu/16/). – The Alpha Aug 25 '12 at 19:01

score 0 · Answer 2 · answered Aug 25 '12 at 18:06

0

Got something working:

http://jsfiddle.net/fantactuka/56VBk/

answered Aug 25 '12 at 18:06

fantactuka

3,298
19
29

Yeah! That's what i want... Thanks! – yckart Aug 25 '12 at 18:12
But, the input fields will not be disabled now... any ideas? – yckart Aug 25 '12 at 18:26

jQuery keyup event increase-"function" will set to 0

2 Answers2