使样式影响整行

Make style affect whole row

本文关键字：影响 样式      更新时间：2024-02-22

在我的文字游戏中，当正确的字母拼写单词时，它会随着"wordglow2"而消失。目前，它对单词做了这样的处理。如果我想在拼写正确的单词时让整排消失，我该怎么做？

$(".drop").droppable({
drop: function(event, ui) {
    word = $(this).data('word');
    guesses[word].push($(ui.draggable).attr('data-letter'));
    console.log($(event));
    console.log($(ui.draggable).text());
    console.log('CHECKING : ' + $(this).text() + ' against ' + $(ui.draggable).text().trim());

    if ($(this).text() == $(ui.draggable).text().trim()) {
        $(this).addClass('wordglow3');
    } else {
        $(this).addClass('wordglow');
    }
    console.log('CHECKING : ' + $(this).text() + ' against ' + $(ui.draggable).text().trim());

    console.log(guesses);
    if (guesses[word].length == 3) {
        if (guesses[word].join('') == word) {
            $('td[data-word=' + word + ']').addClass("wordglow2");
        } else {
            $('td[data-word=' + word + ']').addClass("wordglow4");
            guesses[word].splice(0, guesses[word].length);
        }
    }

我本以为会是这样，但没用。。。

  if (guesses[word].length == 3) {
        if (guesses[word].join('') == word) {
            $('td[data-word=' + word + 'td' + ']').addClass("wordglow2");

根据注释：

目前您将拥有

.wordglow2 { background: red; }

更新它，使其读取

.wordglow2 td { background: red; }

然后更新你的jQuery代码，这样它就可以进行

$('td[data-word=' + word + ']').parent().addClass("wordglow2");

然后将背景颜色应用于行中的所有单元格。

相关文章：