在Pangram的字母上设置课程

时间:2011-01-08 14:28:17

标签: javascript jquery html css jquery-selectors

我正在尝试在一个抵消元素(字母表中的每个字母)上设置正确的类。每个元素都有id#alpha_0到#alpha_25。如果输入中的字母出现一次,请将该字母设置为绿色。如果该字母出现不止一次,请将其设置为红色。如果它没有发生,那么什么都没有(黑色)

下面的代码只是我努力工作的东西。

var isPangram = function() {
 var s = $('#input').val().toLowerCase();
 console.log(s);
 var alpha = letters[getAlphabet()].join('');
 console.log(alpha);
 var len = alpha.length;
 for (var i = 0; i < len; i++) {
  if (s.indexOf(alpha.charAt(i)) != -1) {
   if ($('#alpha_'+i).hasClass('green')) {
    // already matched, go red
   } else {
    // not matched, go green
   }
  } else {
   // no match
  }
 }
}

1 个答案:

答案 0 :(得分:0)

如果您先快速找出每个字母的数量,然后设置类别,那么这是最简单的。

(function($) {
  function getLetterCount(text) {
    var alphabet = 'abcdefghijklmnopqrstuvwxyz';
    var alphabetSet = alphabet.split('');

    var letterCount = {};
    $.each(alphabetSet, function() {
      letterCount[this] = 0;
    });

    var cleanText = text.toLowerCase().replace(/[^a-z]/g, '');

    $.each(cleanText.split(''), function() {
      letterCount[this]++;
    });

    return letterCount;
  }

  function setLetterClasses(letterCounts) {
    $('.letter').removeClass('green').removeClass('red');

    $.each(letterCounts, function(letter, count) {
      if (count > 0) {
        $('#alpha_' . (letter.charCodeAt(0) - 'a'.charCodeAt(0))).addClass(count > 1 ? 'red' : 'green');
      }
    });
  }

  function isPangram() {
    var text = $('#input').val();
    var letterCount = getLetterCount(text);

    setLetterClasses(letterCount);
  }
})(jQuery);