禁用点击悬停

时间:2010-11-16 07:48:54

标签: jquery

我有一个jquery游戏,我的成员一直在寻找获胜的方法。这是数字游戏link text

我已经制作了游戏,所以你不能在firefox上玩它,不知道其他浏览器是否有与firefox相同的作弊工具。

我遇到的第一个问题是游戏玩家会将鼠标放在一个盒子上,直到他们的数字出现然后他们点击它。为了解决这个问题(在stackoverflow的天才帮助下)我们做了这个,所以你不能连续两次点击同一个框。 但是现在这是同样的问题,他们只会移动到另一个盒子并保持他们的鼠标,直到他们看到他们的号码。所以现在我需要这样做,如果他们超过一个盒子超过x秒,他们就无法点击那个盒子。

倒数计时器可能只是做了这个技巧并消除了悬停脚本。请尽可能帮助您。这是剧本。

    var hitCount = 0,
missCount = 0;

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

$("#getit").click(function() {
var hitCount = 0,
missCount = 0;
$('#misscount').text(0);
$('#hitcount').text(0);
$('#message').hide(100);        
$('#randomnumber').empty();
$('#randomnumber').show(300);       
var li = [],
    intervals = 0,
    n = parseInt($('#MyNumber').val());

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 ?>);
}

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

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


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

if (!$this.hasClass('clicked')) {
    if (parseInt($this.text(), 10) === n) {
        $this.addClass('correct');
        $('#hitcount').text(++hitCount);
    } else {
        $this.addClass('wrong');
        $('#misscount').text(++missCount);
    }
}
            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;
});

1 个答案:

答案 0 :(得分:2)

你可以很容易地记住他们何时盯着徘徊。使用包含跨度的ID“container”的跨度的简化示例,用户可以单击:

jQuery(function($) {

  var container, n;
  var HOVER_THRESHOLD = 1000; // Milliseconds

  // Build the grid
  container = $('#container');
  for (n = 0; n < 16; ++n) {
    $("<span>0</span>").appendTo(container).data("hoverStart", 0);
  }

  // Watch for hovers and clicks on the elements
  container.find('span')
    .hover(startHover, stopHover)
    .click(handleClick);

  // At hover start, remember when we started
  function startHover() {
    $(this).data("hoverStart", new Date().getTime());
  }

  // At hover end, clear the hover thingy
  function stopHover() {
    $(this).data("hoverStart", 0);
  }

  // On click, check how long they've been hovering
  function handleClick() {
    var $this, startHover;

    $this = $(this);
    startHover = $this.data("hoverStart");

    // Hovering too long?
    if (startHover != 0
        && (new Date().getTime() - startHover) > HOVER_THRESHOLD) {
      // Yes
      $this.css("color", "red");
      setTimeout(function() {
        $this.css("color", "");
      }, 500);
    }
    else {
      // No, allow click
      $this.html(parseInt($this.html(), 10) + 1);
    }
  }
});​

Live example

或者你可以用计时器做更复杂(但主动)的事情:

jQuery(function($) {

  var container, n;
  var HOVER_THRESHOLD = 1000; // Milliseconds

  // Build the grid
  container = $('#container');
  for (n = 0; n < 16; ++n) {
    $("<span>0</span>").appendTo(container).data("hoverTimer", 0);
  }

  // Watch for hovers and clicks on the elements
  container.find('span')
    .hover(startHover, stopHover)
    .click(handleClick);

  // At hover start, start a timer
  function startHover() {
    var $this = $(this);
    $this.data("hoverTimer", setTimeout(function() {
      $this.addClass("disabled");
    }, HOVER_THRESHOLD));
  }

  // At hover end, clear the timer
  function stopHover() {
    var $this, timer;

    $this = $(this);
    $this.removeClass("disabled"); // May or may not have it
    timer = $this.data("hoverTimer");
    if (timer != 0) {
      clearTimeout(timer);
      $this.data("hoverTimer", 0);
    }
  }

  // On click, check how long they've been hovering
  function handleClick() {
    var $this;

    $this = $(this);

    // Hovering too long?
    if ($this.hasClass("disabled")) {
      // Yes, disallow the click
    }
    else {
      // No, allow click
      $this.html(parseInt($this.html(), 10) + 1);
      // If you want to reset the hover timer on click:
      stopHover.call(this);
      startHover.call(this);
    }
  }
});​

Live example

但是,正如我在评论中所说,你不能相信客户端为此发送给你的任何数据,有太多工具可用于调试Web应用程序(是一件好事!)或者只是完全伪造HTTP消息。在你的情况下,我不认为可能来区分有天赋的玩家和有天赋的玩家(你可以从数据中找到的火腿小伙伴)。