Question

This is a game were a user enters a random number, then clicks “Play”, they’ll see a set of boxes appear with randomly generated numbers. The object of the game is to click on the box that has your number to build points.

How can I make it so, they lose points if they don’t click on the box that has their number.

see game here: link text

solutions I’ve tried.

 if ($('#randomnumber li').hasClass('')) {
    if (parseInt($this.text(), 10) === n) {
        $this.addClass('wrong');
        $('#hitcount').text(--hitCount);
    } 
}

thought the .attr(‘class’, ”) gave all li’s a ” class

  if ($('<li />').hasClass('')) {
    if (parseInt($this.text(), 10) === n) {
        $this.addClass('wrong');
        $('#hitcount').text(--hitCount);
    } 
}

Tried several other variations of the above code including

if($('#randomnumbers li')not.('Clicked')

nothing worked

here’s the complete script

var hitCount = 0,
missCount = 0;

         function IsNumeric(n) {
return !isNaN(n);
}

         $("#getit").click(function() {
//Resets Game to 0 points

var hitCount = 0,
missCount = 0;
$('#misscount').text(0);
$('#hitcount').text(0);
$('#message').hide(100);        
$('#randomnumber').empty();
$('#randomnumber').show(300);

//starts game get users value

var li = [],
    intervals = 0,
    n = parseInt($('#MyNumber').val());

//set game speed

if (IsNumeric(n)) {
   intervalId= setInterval(function() {
        li[intervals++ % li.length].text(Math.random() > .1 ? Math.floor(Math.random() * (10 + n) + (n / 2)) : n).attr('class', '')    ;
    }, <?php echo $time ?>);
 }

 //empty all numbers in the boxes 

$('#randomnumber').empty();

 //generate new boxes 

for (var i = 0; i < 7; i++) {
    li.push($('<li />').one('click', function() {
        BoxClick.call(this, n);
    }).appendTo('#randomnumber'));
}

//get which box is clicked 

function BoxClick(n) {
var $this = $(this);
$('#randomnumber li').unbind().one('click', function() {
        BoxClick.call(this,n);
});
$this.unbind();

//add points if the box clicked matches the users value, subtract points if they don't.

    if (!$this.hasClass('clicked')) {
    if (parseInt($this.text(), 10) === n) {
        $this.addClass('correct');
        $('#hitcount').text(++hitCount);
    } else {
        $this.addClass('wrong');
        $('#misscount').text(++missCount);
    }
 }
     //if user gets three misses submit score to database

            if(missCount==<?php echo $limit ?>){
               clearInterval(intervalId);
               $('#randomnumber').hide(300);

                $.ajax({
type : 'POST',
url : 'FBhighscore_hwnd.php',
dataType : 'json',
data: {
tgameid: $('#tgameid').val(),MyNumber: $('#MyNumber').val(),totalHits: hitCount
},
success : function(data){
$('#waiting').hide(500);
$('#message').removeClass().addClass((data.error === true) ? 'error' : 'success')
.text(data.msg).show(500);
if (data.error === true)
$('#loginForm').show(500);
else
$('#send').hide(500);       
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
$('#waiting').hide(500);
$('#message').removeClass().addClass('error')
.text('There was an error.').show(500);
$('#loginForm').show(500);
}
});

            }


$this.addClass('clicked');
}
return false;
});

Answer 1

Since you are already tagging a box with the “correct” class when the user clicks the correct answer, couldn’t you just check for the lack of that class when you change a box’s number? Something along the lines of this:

function ChangeBoxNumber(box) {
   if (parseInt(box.text(), 10) === n && !box.hasClass('correct')) {
       //missed answer, you lose a point!
   }
   //change number
}