如何让用户在jquery中的按钮上只点击3次?

时间:2011-06-11 15:16:34

标签: javascript jquery

我正在尝试制作一个小石头剪刀游戏。为此我在jquery中写了一个小的javascript。整个事情应该像这样工作:用户按下按钮,触发ajax事件,选择的选项被添加到div和计数器增量。但只有3次!我无法弄清楚这样工作......这是我的代码

if (counter <= 3){
    $('.buStein1').click(function(event){
        $.post("game.php", { uid: "<?php echo $user['id']?>", choice: "stein", runde: counter  });
        $('#choiceContainer').append(stein);
        counter++;
      });
    $('.buSchere1').click(function(event){
        $.post("game.php", { uid: "<?php echo $user['id']?>", choice: "schere", runde: counter  });
        $('#choiceContainer').append(schere);
        counter++;
      });
    $('.buPapier1').click(function(event){
        $.post("game.php", { uid: "<?php echo $user['id']?>", choice: "papier", runde: counter  });
        $('#choiceContainer').append(papier);
        counter++;
      });
}
else {
    $('#choiceContainer').text('no clicking possible');
}

2 个答案:

答案 0 :(得分:4)

首先在函数之外定义你的计数器:

var counter = 0;

然后在执行任何其他操作之前检查click事件处理程序中的计数器:

$('.buStein1').click(function(event){
    if (checkCounter()) {
      $.post("game.php", { uid: "<?php echo $user['id']?>", choice: "stein", runde: counter  });
      $('#choiceContainer').append(stein);
    }
  });
$('.buSchere1').click(function(event){
    if (checkCounter()) {
      $.post("game.php", { uid: "<?php echo $user['id']?>", choice: "schere", runde: counter  });
      $('#choiceContainer').append(schere);
    }
  });
$('.buPapier1').click(function(event){
    if (checkCounter()) {
      $.post("game.php", { uid: "<?php echo $user['id']?>", choice: "papier", runde: counter  });
      $('#choiceContainer').append(papier);
    }
  });


function checkCounter() 
{
  if (counter > 3)
  {
    $('#choiceContainer').text('no clicking possible');
    return false;
  }

  counter++;
  return true;
}

答案 1 :(得分:3)

if (counter <= 3)检查应该在click函数内。

如果计数器少于三个,那么当你绑定点击事件时。