以任何方式将JQuery输入限制为以前未输入的唯一字符

问题描述 投票:0回答:1

我有一个简单的JQuery / JS Hangman游戏,我花了很多时间使它工作,我遇到了一个问题,弄乱了我的逻辑和游戏的运行 - 当玩家输入重复的字符时(无论是对还是错) )。

我让游戏工作的方式,从我正在推进的空数组开始,我认为我可以创建一个函数来只将唯一的字符推入数组函数

unique(array) {
    var result = [];
    $.each(array, function(i, e) {
        if ($.inArray(e, result) == -1) result.push(e);
    });
    return result;
    }
    var uniqueRightGuesses = unique(rightGuesses);
    var uniqueWrongGuesses = unique(wrongGuesses);

但这不起作用,因为w /我的游戏的内部运作,重复的输入字符仍然显示和搞乱输入赢得和失去的方式(即使我正在计算获胜w /一个额外的数组的总和我已经创建了一个可以在一个单词中重复多次的字母。我已经在游戏的各个部分/各种功能中尝试了很多各种各样的东西,我发现解决这个问题的最简单的方法是以某种方式阻止玩家输入一个字符,如果他们已经在游戏过程中输入,在此功能中:

$(".form-control").keypress(function(event) {
    var keycode = (event.keyCode ? event.keyCode : event.which);
    if (keycode == 13) {
      var space = $(this).val().toLowerCase();
      play(space);
      $(this).val('');
      endGame();
      return false;
    }
  });

我在网上搜索了一种方法,我找到了jQuery.unique(),但我不认为它在这里工作,因为它只在数组中的DOM对象上(我只想输入到如果玩家已经输入了该字母,如果我猜错了 - 如果我在游戏中的这个位置处理这个问题,那么我就不会注册/不允许使用我的数组或变量我正在展示,但我不知道如何简单地做到这一点。如果有人有任何建议或知道这是否可能,我真的很感激 - 我已经在网上找到了很多关于限制特殊字符和数字的信息。方式,但没有关于已经输入的那些&我不知道这是否可能(这是我第一次使用.keypress()所以我对它有点新意。任何建议都会非常感谢。谢谢!这是我的整个游戏代码:

var wordBank = ["modernism", "situationalist", "sartre", "camus", "hegel", "lacan", "barthes", "baudrillard", "foucault", "debord", "baudrillard"];
var word = [];
var answer = [];
var wrongGuesses = [];
var rightGuesses = [];
var right = [];
var images = [gallows, head, body, armL, handL, armR, handR, legL, footL, legR, footR];
var y = 0;
var i = 1;
$(document).ready(function() {
  function randomWord() {
    var random = Math.floor(Math.random() * wordBank.length);
    var toString = wordBank[random];
    console.log(toString);
    word = toString.split("");
    console.log(word);
  }
  randomWord();

  function wordSpaces() {
    for (var i = 0; i < word.length; i++) {
      $(".word-spaces > tbody > tr").append('<td data-idx=i>' + word[i] + '</td>')
    }
  }
  wordSpaces();

  function play(space) {
    //indexOf()==inArray() 
    var rightCount = 0;
    var lIndex = jQuery.inArray(space, word);
    console.log(lIndex);
    if (lIndex == -1) {
      wrongGuesses.push(space);
      var wrong = wrongGuesses.length;
      console.log('wrong ' + wrong);
      $('.wrongLetters tbody tr td:nth-of-type(' + wrong + ')').text(space);

      //      $(this).css("background-color", "#ff4500").fadeIn(300).delay(800).fadeOut(300);
      $(images[i - 1]).hide();
      $(images[i]).show();
      i++;
      $("html").css("background-color", "#ff4500").fadeIn(300).delay(300).fadeOut(300).fadeIn(100);
      console.log(word);
    } else {
      var totalRight = 0;
      console.log(word + "word");
      console.log(space + "space");

      function getInstances(word, space) {
        var indexes = [],
          w;
        for (w = 0; w < word.length; w++)
          if (word[w] === space)
            indexes.push(w);

        return indexes;
      }
      console.log(word + "word");
      console.log(space + "space");
      var indexes = getInstances(word, space);
      console.log("indexes", indexes);
      indexes.forEach(function(index) {
        //      answer[index] = space;
        rightCount++
      });
      console.log(rightCount + "rightcount");
      console.log("answer", answer);
      //    rightGuesses.push(space);
      console.log(rightGuesses);
      //    var right = rightGuesses.length;
      indexes.forEach(function(index) {
        $(".word-spaces tbody tr td:nth-of-type(" + (index + 1) + ")").css('color', 'black');
      });
      rightGuesses.push(space);
      right.push(rightCount);
      console.log(right + "right");
      //    rightGuesses.push(space);
      //  totalRight =  totalRight + rightCount;
      // totalRight++;
      //   console.log(totalRight + 'totalRight');
    }
  }
  console.log(right + "right");
  $(".form-control").keypress(function(event) {
    var keycode = (event.keyCode ? event.keyCode : event.which);
    if (keycode == 13) {
      var space = $(this).val().toLowerCase();
      play(space);
      $(this).val('');
      endGame();
      return false;
    }
  });


  function endGame() {
    var sumRight = right.reduce(add, 0);

    function add(a, b) {
      return a + b;
    }
    if (sumRight == word.length) {
      $(images[i]).hide();
      $("#victory").show();
      $("body").css("background-color", "#8AFBFF");
      $(".form-control").prop('disabled', true);
      $("body").animate({
        backgroundColor: "#0C0D86"
      }, 2000);
      $("body").animate({
        backgroundColor: "transparent"
      }, 2000);
    } else if (wrongGuesses.length >= 10) {
      $("body").css("background-color", "#ff4500");
      $(".form-control").prop('disabled', true);
      $("body").animate({
        backgroundColor: "#000000"
      }, 2000);
      $("body").animate({
        backgroundColor: "transparent"
      }, 2000);
    }
  }

});
javascript jquery input user-input keypress
1个回答
1
投票

使用Array.indexOf()。不需要jQuery。

检查按下的键是否包含在wrongGuess或rightGuess数组中,以及是否提醒用户。

$(".form-control").keypress(function(event) {
        var keycode = (event.keyCode ? event.keyCode : event.which);
        if (keycode == 13) {
          var space = $(this).val().toLowerCase();

          if (!(wrongGuess.indexOf(space) > -1 || rightGuess.indexOf(space) > -1)) {
            play(space);
            $(this).val('');
            endGame();
            return false;
          }
          else
            window.alert("You already guessed this letter.");

        }
      });
© www.soinside.com 2019 - 2024. All rights reserved.