javascript - 保持不正确的字母可见

Question

编辑

在我的拖放游戏中，有一个网格填充了对用户隐藏的单词。游戏的目的是借助声音和图片拼出这些单词。用户通过将相关字母拖放到网格上来拼写单词。

如果字母是正确的，它会发出绿光并带有“wordglow3”类。如果错误，它会发出红色的“wordglow”字样。由于该游戏是为 child 设计的，所以我希望他们看到他们掉落的字母会一直留在那里，直到尝试完成，这样他们才能看到完整的单词，所以我使用了...

$(that).html($(ui.draggable).text().trim());

让它留在那儿。问题是，如果用户弄错了单词，那么在下一次尝试使用同一个单词时，这将不起作用，我不知道为什么。如果用户到达下一个单词，它将在第一次尝试时再次工作，依此类推。谁能帮我让它保持一致？

这是执行操作的代码...

if ($(that).data("letter") == $(ui.draggable).text().trim()) {

            $(that).removeClass("wordglow").addClass('wordglow3').css('color', 'white');
            $(that).html($(ui.draggable).text().trim());

        } else {

            $(that).addClass('wordglow');
            $('.drag').css("color", "white");
            $(that).html($(ui.draggable).text().trim());

        }

有什么方法可以让我在每次尝试这个词后重新设置？我曾尝试将其设为一个变量，然后将其重置为零，但没有成功。

fiddle 的帮助 - http://jsfiddle.net/smilburn/m8Squ/6/

Answer 1

我解决了这个问题。

       if ($(that).data("letter") == $(ui.draggable).text().trim()) {

            $(that).addClass('wordglow3').css('color', 'white');
            $('.drag').css("color", "white");
            $(that).html($(ui.draggable).text().trim());


        } else {

            $(that).addClass('wordglow').css('color', 'white');
            $('.drag').css("color", "white");
            $(that).html($(ui.draggable).text().trim());

        }