jquery-ui datepicker с jquery .on () event

я использую обычный адрес jquery, пример вкладок и хочу добавить datepicker на вкладку «Дополнительно». Если я просто добавляю

$(document).ready(function() {
    $( "#datepicker" ).datepicker();
});

, это не будет работать. Итак, я узнал, что мне нужно использовать .live (). Поскольку я использую jquery-1.7. Live () изменил на .on ().

Если я добавлю этот код, датапикер будет работать только при втором щелчке.

$(document).ready(function() {
  $(document).on('click', '#datepicker', function () {
    $(this).datepicker();
  });
});

Я видел в другом потоке не рекомендуемый способ заставить его работать вот так

$(document).ready(function() {
  $(document).on('click', '#datepicker', function () {
    $(this).datepicker().datepicker( "show" );
  });
});

Как я его правильно использую? Есть ли рекомендуемый способ заставить datepicker работать так, как я хочу в этом примере?

Я думаю, мне нужно использовать .on (), потому что я хочу перезагрузить форму, включающую #datepicker, с событием .load ().