jquery - jquery を使用して、リンクの前にフィールドにフォーカスを設定する

Question

pickadate.js で使用している日付フィールドがいくつかあります。フィールドにフォーカスすると、日付ピッカーがポップアップします。よく働く。

クライアントは、次のように、フィールドにフォーカスを設定する (したがって、ピッカーをポップアップする) 各フィールドの横にグラフィック アイコンを必要とします。

各フィールドの私のコードは次のようなものです:

<div class="date-picker">
    <label for="start-date">Start Date</label>
    <input id="start-date" class="datepicker" type="text" readonly="">
    <div class="date-button"><img src="/images/icon-datefield.png" alt=""></div>
</div>

私はこのようなことをいくつか試しましたが、役に立ちませんでした:

$('.date-button').click(function(){
    $(this).prev().focus();
})

ここで何が欠けていますか？

Answer 1

上記の回答は、jquery UI datepicker を使用して解決する方が適していますが、誰かがdatepicker.jsを使用したい場合、これは最終的に機能しました:

var start_date_open = $( '#start-date' ).pickadate(),
    start_calendar_open = start_date_open.data( 'pickadate' ),
    start_button_open = $( '.date-button' ).on({
                    click: function() {
                        setTimeout( function() {
                            start_calendar_open.open()
                        }, 0)
                    }
                });