Question

我正在尝试从0到9创建一个数字小键盘，当按特定顺序按某些数字时，会发生event。

这样的事情

if ( button1 gets pressed then button2 then button3 )
    alert('You did the code!')
}
else {
    alert('You did not do the code')
}

不，jQuery请

谢谢！

Answer 1

我将通过监视keydown事件来实现此目的，如果键是数字，则添加到数组中。同时，检查数组内容以查看它们是否按特定的顺序排列。如果是，请解雇您需要做的任何事情，如果没有，除了将密钥添加到数组之外什么都不做。完成序列后，清除阵列以便为新序列腾出空间。

你可能会遇到类似的事情，比如在没有完成序列的某个时间间隔后清除数组等。

Answer 2

＆＃13;

//sequence is 358

//SOLUTION

sequence = {
  
 check : function(e){
  sequence.value += this.textContent;
 
   if (sequence.value == sequence.sequence)
     {
       alert(1);
       sequence.value = "";
     }
   else 
   {
     if (sequence.timer)
     {
        clearTimeout(sequence.timer);
     }
     sequence.timer = setTimeout("sequence.value=''", 1000);
   }
}, 
 
  value : "",
  sequence : "358"

}

//THIS CODE ATTACHES CLICK HANDLERS TO THE BUTTON, NOT PART OF THE SOLUTION

Array.prototype.map.call(document.querySelectorAll("button"), function(element){
  element.addEventListener("click", sequence.check, false);
});

//end

＆＃13;

<button>7</button><button>8</button><button>9</button><br/>
<button>4</button><button>5</button><button>6</button><br/>
<button>1</button><button>2</button><button>3</button><br/>
<button>0</button>

＆＃13;

这是如何工作的。我不想用值污染全局范围，因此我使用了一个对象来存储变量和check方法。

该对象名为sequence。

它有三个属性

check，单击按钮时检查输入的方法。

value，它保存序列值，直到找到正确的序列。

sequence，保存正确值的属性。

页面上的每个按钮都分配有一个点击处理程序。点击后会触发sequence.check。通过this关键字（参考按钮），我们提取数字（通过textContent）。我们将该数字添加到值字符串中。然后我们检查值是否与序列匹配。如果是这样，执行一些代码（在这种情况下是警报）并重置值。

有一个定时器设置。如果用户在一秒钟内没有输入新号码，则计时器将重置value。 setTimeout这样做。 1000代表1000 milliseconds = 1 second。

Answer 3

这是一个简单的系统，它可以满足您的需求：

var buttons = document.querySelectorAll('button'),
  i;

for (i = 0; i < buttons.length; i++) {
  buttons[i].addEventListener('click', function() {
    var pressed = document.getElementById('pressed');
    pressed.value += this.value + "|";
    if (pressed.value === '1|2|3|') {
      alert('You unlocked it!');
    }
    if (pressed.value.length >= 6) {
      //Start over
      pressed.value = "";
    }
  }, false);
}

<input id='pressed' type='text' />
<button value='1'>One</button>
<button value='2'>Two</button>
<button value='3'>Three</button>

使JavaScript检测按钮按某种顺序按下

3 个答案: