Clockpicker：如何防止点击输入打开clockpicker答案

【问题标题】：Clockpicker: How to prevent click on input to open clockpickerClockpicker：如何防止点击输入打开clockpicker
【发布时间】：2016-04-30 21:47:46
【问题描述】：

我在我的页面上使用weareoutman's clockpicker。如何防止在时钟选择器可见之前单击输入以显示时钟选择器或淡入淡出？我只是想在时钟选择器显示之前淡入叠加。单击“按钮”按需要工作。到目前为止，我已经在clockpicker 中尝试了 beforeShow 函数，还尝试了 jQuery 中的 e.preventDefault() 和 e.stopPropagation() 函数。

HTML：

<div class="dialog">
    <div>Clock:</div>
    <div class="input-group" id="clockpicker">
        <input type="text" id="start-time" class="clock text-right" readonly />
        <span class="button button-gray icon icon-clock"></span>
    </div>
<div class="dialog-overlay hide"></div>
</div>

jQuery:

var clock = jQuery('#clockpicker'),
    dialog_overlay = jQuery('.dialog-overlay');

clock.clockpicker({
    autoclose: true,
    afterDone: function() {
        dialog_overlay.fadeOut('slow');
    }
});

clock.on('click', function(e) {
    dialog_overlay.fadeIn('slow', function() {
        clock.clockpicker('show');
    });
});

【问题讨论】：

标签： jquery html clock

【解决方案1】：

我找到了解决问题的方法。在输入字段中关闭点击事件。

clock.find('input').off('focus.clockpicker click.clockpicker');

我希望这个解决方案也对其他人有所帮助。

【讨论】：

【解决方案2】：

使用最新版本的库，您可以执行以下操作：

$('#inputId').clockpicker({
        beforeShow: function e() {            
            var condition = "...";
            if (!condition) {
                e.stopPropagation();
            }
        }            
    });

【讨论】：