5

Trent Richardson の jQuery UI Timepicker を使用しています。$.datepicker._selectDate をオーバーライドするようにプラグインが変更されているため、日付が選択されたときにピッカーが開いたままになります。それは素晴らしいことです。

ただし、日付をダブルクリックしたときにピッカーを閉じるように求められました。完了時にピッカーを閉じるボタンなど、他のすべては同じままですが、ダブルクリックも機能するようにしたいだけです。

いくつかの方法でダブルクリック イベントをカレンダーの日付にバインドしようとしました (ほとんどのバリエーション$('.ui-datepicker-calendar a').bind('dblclick', function () {/*do something*/});)- 実際、他のイベントもバインドしようとしましたが、何も機能していないようです。How to に投稿された提案を試しました。喜びのないダブルクリックでDateTimePickerを閉じます。

これは可能ですか？クリックとダブルクリックを区別するために onSelect 関数を変更する必要がありますか? (そして、どのようにevent.typeundefined が定義されていないのですか?) 間違った要素にバインドしていますか? (私は$('.ui-datepicker-calendar a')、$('#ui-datepicker-div')、$('#ui-datepicker-div .ui-datepicker-calendar a')、および他の多くのバリエーションでバインドを試みました。)

完全を期すために、ここに私のコードがあります：

$('#date-range-from, #date-range-to').datetimepicker({
    changeYear: true,
    changeMonth: true,
    controlType: 'select',
    dateFormat: 'M dd, yy ',
    minDate: 'Jan 01, 2010 ',
    maxDate: 'Dec 31, xxxx '.replace('xxxx', new Date().getFullYear() + 1),
    showAnim: '',
    showMinute: false,
    showOtherMonths: true,
    showTime: false
}).on('change', function () {
    var t = $(this),
        date = t.val().slice(0, 12),
        fromto = t.attr('id').replace('date-range-', ''),
        time = t.val().slice(-5);
    dashboardOpts.dateRange[fromto].date = date;
    dashboardOpts.dateRange[fromto].time = time;
}).mousedown(function () {
    $('#ui-datepicker-div').toggle();
    $(this).blur();
});
$('#ui-datepicker-div .ui-datepicker-calendar a').bind('dblclick', function () {
    console.log('I just want to see if this event can be bound!');
});

助けてくれてありがとう！

編集： 明確にするために、「...のバリエーション」とは、 （非推奨であることはわかっていますが） andを.bind('dblclick', ...)試したことを意味します。.live('dblclick', ...)$(element).on('dblclick', ...)$(document).on('dblclick', element, ...)

私も試みましたが.stopPropagation()、.stopImmediatePropagation()これが伝播の問題であるとは思いません.

datetimepicker プラグインのコードに、カレンダーのイベントをハイジャックしている何かがあると思います。残念ながら、私はまだそれを見つけることができませんでした。どんな洞察も大歓迎です！

4

3 に答える 3

6

datetimepicker のソースでは、作成者がハックを使用して、日付が選択されたときに閉じるのを無効にしていることがわかります。彼はそれを自分自身を悪いハックと呼んでいます。

とにかく、日付をダブルクリックしたときに日付ピッカーを閉じることができる回避策があります。onSelect関数コールバックを使用します：

デモを見る

 $('#mydatepicker').datetimepicker({
     onSelect: function (e, t) {
         if (!t.clicks) t.clicks = 0;

         if (++t.clicks === 2) {
             t.inline = false;
             t.clicks = 0;
         }
         setTimeout(function () {
             t.clicks = 0
         }, 500);
     }
 });

したがって、何らかの方法で、タイムアウトを使用して dblclick の動作をシミュレートします。私は 500ms に設定しましたが、dblclick の感度を上げたり下げたりしたい場合は、これで遊んでください。

アップデート

@JaredKnipp月が切り替わるとフォーカスが入力に設定されているようです（無効???）、詳細を確認する時間がありません、申し訳ありません。簡単な回避策として、次のスニペットを試すことができます。それを endDateTextBox onClose コールバックに追加します。

         var focusHandlers = $._data(endDateTextBox[0], "events").focus;
         $._data(endDateTextBox[0], "events").focus = {};
         endDateTextBox.one('focusin.datetimepicker mouseenter.datetimepicker', function () {
             setTimeout(function () {
                 $._data(endDateTextBox[0], "events").focus = focusHandlers;
                 endDateTextBox.blur();
             }, 0);
             $(this).off('focusin.datetimepicker mouseenter.datetimepicker');
         });

1.8 より前のバージョンの jq を使用している場合は、使用し$.data()ないでください$._data() 。

于 2013-04-16T16:37:32.100 に答える
0

以下は機能しますか？

$('#ui-datepicker-div .ui-datepicker-calendar a').dblclick(function () {
  console.log('I just want to see if this event can be bound!');
});

dblclick ドキュメント.

于 2013-03-27T18:52:30.247 に答える
0

編集

livejquery 1.7 またはonjquery 1.9でも試してください:

$('#ui-datepicker-div .ui-datepicker-calendar a').live('dblclick', function () {
  alert('I just want to see if this event can be bound!');
});

a tagバインドする前にバインドを解除してみてください。多分それは別の関数とバインドします:

$('#ui-datepicker-div .ui-datepicker-calendar a').unbind('dblclick');
$('#ui-datepicker-div .ui-datepicker-calendar a').bind('dblclick', function () {
  alert('I just want to see if this event can be bound!');
});
于 2013-03-27T19:06:43.823 に答える