Bootstrap 表单助手时间选择器无法在我的手机上运行 phone

Bootstrap form helper time picker not working on my mobile phone

我已经实现了 Bootstrap form helper: time picker plugin,它在我的桌面浏览器上运行正常。这是代码:

<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" class="form-horizontal" role="form">
    <div class="form-group">
        <label for="start_time" class="col-sm-2 control-label">Start time</label>
        <div class="col-sm-10">
            <div class="bfh-timepicker" id="start_time" data-name="start_time">
            </div>
        </div>
    </div>
</form>

这是结果:

这是我点击后的结果:

正如我所说,这在我的桌面浏览器上运行良好 (Google Chrome)。但是在我的手机 phone(HTC One 使用 Google Chrome)上,时间选择器无法正常工作。我可以像在第一个图中那样单击它,但是当我尝试使用向上和向下箭头输入时间时,没有任何反应。

如何解决这个问题?

编辑:使用 IE 在我的手机 phone 上试过,仍然是同样的问题。

如评论中所述,似乎很少有人支持使用此插件。我最终改用 https://github.com/Eonasdan/bootstrap-datetimepicker

第一次改变

.on('mousedown.bfhnumber.data-api', '.inc', BFHNumber.prototype.btninc)
.on('mousedown.bfhnumber.data-api', '.dec', BFHNumber.prototype.btndec);

.on('touchstart.bfhnumber.data-api mousedown.bfhnumber.data-api', '.inc', BFHNumber.prototype.btninc)
.on('touchstart.bfhnumber.data-api mousedown.bfhnumber.data-api', '.dec', BFHNumber.prototype.btndec);

然后找到 "btninc" 和 "btndec" 函数

评论

$this.increment();  
$this.decrement();

将"etInterval()"细化为"setTimeout()"

您的代码将是这样的:

btndec: function() {
  var $this,
      timer;

  $this = $(this).parent().find('.bfh-number').data('bfhnumber');

  if ($this.$element.is('.disabled') || $this.$element.attr('disabled') !== undefined) {
    return true;
  }

  // $this.decrement();

  timer = setTimeout(function() {
    var interval;
      interval = setTimeout(function() {
      $this.decrement();
    }, 0);
    $this.$element.data('interval', interval);
  }, 600);
  $this.$element.data('timer', timer);

  $(document).one('mouseup', {btn: $this}, BFHNumber.prototype.mouseup);

  return true;
}