我有一个简单的数字输入,其中min =“1”和max =“12”值设置,这用作小时选择器.我希望它循环播放时间,所以当你到达12并按下“向上”箭头时,它会回到1,反之亦然.
现在我有这个主要工作:
var inputTimer = null; function cycle(element) { if (element.attributes.max && element.attributes.min) { var prevVal = element.value; inputTimer = setTimeout(function() { if (prevVal === element.attributes.max.value) { element.value = element.attributes.min.value; } else if (prevVal === element.attributes.min.value) { element.value = element.attributes.max.value; } },50); } } $("input[type='number']") .on("mousedown",function(e) { //this event happens before the `input` event! cycle(this); }).on('keydown',function(e) { //up & down arrow keys //this event happens before the `input` event! if (e.keyCode === 38 || e.keyCode === 40) { cycle(this); } }).on('input',function(e) { //this event happens whenever the value changes clearTimeout(inputTimer); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="number" min="1" max="12" value="12" />
我遇到的问题是我找不到一种方法来检测输入中的箭头微调器是否已被点击,或者只是单击了整个输入.现在它有一个问题,当值当前为1或12时,当您单击字段中的任何位置时它会更改值
有没有办法检测文本字段中的微调器/箭头上是否发生了单击事件?