0

I'm making a hangman game and I'm writing a function to search for a letter in the word. So when the user clicks on a letter, I am grabbing the text in there and searching for it in the chosen word.

The code I have written is:

    function searchLetter()
    {
     var aLetter = letter.toLowerCase();
     var aChosenWord = chosenWord.toLowerCase(); 
     //chosenWord is a global variable initialised in another function
     if(aChosenWord.indexOf(aLetter) != -1) 
     alert("Letter is there")
     else 
     {
         alert("Letter not found")
     }
    }

The variable 'letter' is a global variable and was given a value based on what has been clicked:

    $(function(){
  $('a').click(function () {
      letter = $(this).text();
    $(this).slideUp();
    searchLetter()
});
    });

I'm not sure what I've done wrong here. I put in a bunch of alert boxes and my code seems to be grabbing the letters correctly.

When I run this however, every time I'm getting the value of -1 for indexOf; i.e. the letter is not found in the word.

I cannot figure out what it is I've done wrong here!!

Any input is greatly appreciated,

Thanks

17
  • 2
    Variables letter and chosenWord are not defined in searchLetter() function.
    – VisioN
    Jul 22, 2013 at 15:11
  • 2
    @VisioN it's apparently global, according to the question. It would be helpful to see the HTML. The letter is taken from the text content of some <a> tag, which will be the same every time.
    – Pointy
    Jul 22, 2013 at 15:12
  • Have you thought about using Regex?
    – Toiletduck
    Jul 22, 2013 at 15:13
  • <a id = "A" value = "A"> A </a> &nbsp <a id = "B" value = "B"> B </a> &nbsp
    – Misemefein
    Jul 22, 2013 at 15:13
  • 3
    @Misemefein have you tried stepping through your code to see what values end up in aChosenWord and aLetter? Jul 22, 2013 at 15:14

3 Answers 3

0

While I am not an advocate for unnecessary global vars, the code below should do what you need.

HTML

<span id="chosenWord">Some awesome word</span>
<br />
<a href="#" class="letter">a</a>
<a href="#" class="letter">b</a>
<a href="#" class="letter">d</a>
<a href="#" class="letter">e</a>

JS

var letter,
    chosenWord = document.getElementById('chosenWord');
$('a').on('click', function () {
    if (chosenWord.innerHTML.toLowerCase().indexOf($(this).text().toLowerCase()) !== -1) {
        console.log('Found ' + $(this).text())
    } else {
        console.log($(this).text() + ' not found.');
    }
});

JSFiddle demo

0

It would be better to create a context for your global variables, e.g.:

jQuery(function($) {
    var chosenWord;

    $('a').click(function() {
        var $this = $(this);

        $this.slideUp();
        searchLetter($this.text(), chosenWord);
    });

    // link that generates new game?
    $('.generate-new-word').function() {
        chosenWord = generateNewWord();
    });
});

The searchLetter() function receives the letter and word as its arguments and is thus decoupled from this code.

I've also written an example of how the word generation function can be integrated. As with searchLetter() this function has no knowledge of any global state.

This would be the implementation of your searchLetter():

function searchLetter(letter, chosenWord)
{
   var aLetter = letter.toLowerCase();
   var aChosenWord = chosenWord.toLowerCase(); 

   if(aChosenWord.indexOf(aLetter) != -1) {
      alert("Letter is there")
   } else {
      alert("Letter not found")
   }
}

Organizing your code this way reduces the chance of introducing bugs in the code, because the context is managed exclusively inside only a small part of your code.

1
  • Hi Jack, thanks for that - I'm a newbie to jQuery so still getting my head around all this. Original problem solved (I had left in some spaces in my html file, doh!). But this is definitely helpful for tidying up my code. Thanks again.
    – Misemefein
    Jul 22, 2013 at 15:35
-1

Did you declare the global variable with? (check the scope):

var letter = ''

Why not prefer passing the variables within the argument list of the searching function?

1
  • Probably better to define global variables on window in case the scope is accidentally limited (it's best to avoid global variables as much as possible though). Jul 22, 2013 at 15:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.