保持不正确的字母可见

Question

编辑

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

如果字母正确，它会在“wordglow3”类中发出绿色光。如果它是错误的，它会发出“wordglow”的红光。因为这个游戏是为孩子们准备的，所以我希望他们看到他们放下的字母会一直留在那里，直到尝试完成，这样他们才能看到完整的单词，所以我使用了......

$(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());

        }

有没有办法在每次尝试单词后重置？我尝试将其设为变量，然后将其重置为零，但它不起作用。

提供帮助的小提琴 - 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());

        }