让用户在三次尝试后继续进行

Question

在我的拼写游戏中，有一个填充了单词的网格。 这些单词是隐藏的，游戏的目的是拼写借助声音和图片突出显示的单词。

要突出显示单词，请按“下一步”按钮。 目前，如果你拼写正确的单词，它说“做得好”，你可以前进到下一个单词，但如果你拼写错误，你必须继续尝试这个单词，直到它完成。

由于游戏是为儿童设计的，我不认为这是最好的方法，所以我想这样做，这样你可以在3次不正确的尝试后前进。

我已经玩过脚本这么多尝试将计数器置于不正确的尝试，然后使按钮处于活动状态，但似乎无法让它工作。 有人可以帮帮我吗？

这是按钮的脚本

var noExist = $('td[data-word=' + listOfWords[rndWord].name + ']').hasClass('wordglow2');
if (noExist) {
    $('.minibutton').click();

} else {
    $('.minibutton').click('disable');
    $("#mysoundclip").attr('src', listOfWords[rndWord].audio);
    audio.play();
    $("#mypic").attr('src', listOfWords[rndWord].pic);
    pic.show();
}
});

“wordglow2”是单词拼写正确时应用的样式。 这是帮助理解的小提琴...... http://jsfiddle.net/smilburn/ZAfVZ/4/

Answer 1

向脚本添加全局变量

var numberOfTries = 0;

接下来，在$（'。drag'）。on（'click'）侦听器回调中，您有一个if语句，用于确定单词是正确还是不正确：

if (!$('.drop-box.spellword:not(.occupied)').length)

在if语句中，将numberOfTries重置为0.在else语句中，您将放置：

numberOfTries++;
if (numberOfTries >= 3)
{
    $('.minibutton').prop('disabled', false);
}

这将计算尝试次数，并在第三次尝试后，将启用“下一步”按钮。 一旦用户获得正确的单词，它将把变量重置为0。

Answer 2

你可以做的是使用jQuery的.data（）函数将计数器附加到每个TR。 在尝试失败时，递增计数器并根据该值确定是否禁用或启用按钮。 我修改了你发送的jsfiddle并添加了这个行为。 看看有这条评论的行（你可以用Ctrl + F找到它）//在这里编辑

http://jsfiddle.net/dflor003/ZAfVZ/7/