jQuery Datepicker - zamknij na wejściu kliknij

Question

Używam jQuery Datepicker i mam mały problem.

Jeśli datepicker jest otwarty i ponownie klikniesz pole wprowadzania, nic się nie dzieje. Jak mogę to zmienić ... Wybieracz, który ma zostać zamknięty na wejściu, kliknij czy jest już otwarty?

góry dzięki ...

Answer 1

Ponieważ to wiąże się z focus (domyślnie), można po prostu wiążą swoją .mousedown() obsługi i nie będzie on kolidował coś takiego:

$("#datepicker").datepicker(); 
$("#datepicker").mousedown(function() { 
    $(this).datepicker("hide");  
}); 

You can give it a try here . Używam mousedown, ponieważ w ten sposób wykrywane jest również bliskie zachowanie, więc po prostu być spójnym z bardziej przyszłościowym zabezpieczeniem tego zachowania.

Answer 2

Ponieważ nie mogę jeszcze skomentować ...

Jeden irytujące jest to, ponieważ datepicker wykorzystuje ostrości, raz go ukryć, nie można wyświetlić je ponownie bez rozmycia, a następnie skupienie (kliknij gdzieś tak w przeciwnym razie kliknij ponownie).

Rozwiązałem to przez dodanie poniższych informacji aby odpowiedzieć Nick Craver użytkownika (wewnątrz mousedown):

$(this).blur(); 

Tak powinno to wyglądać tak:

$("#datepicker").datepicker(); 
$("#datepicker").mousedown(function() { 
    $(this).datepicker("hide"); 
    $(this).blur(); 
}); 

Answer 3

znalazłem lepszy sposób. hide sprawia, że ​​nie otwiera się na kolejne kliknięcia. Rozmycie powoduje, że selektor daty otwiera się sekundę później.

Kiedyś przełącznik:

$('.datepicker').mousedown(function() { 
    $('#ui-datepicker-div').toggle(); 
}); 

Answer 4

Aby pracować więcej niż jeden raz (kliknij kilka razy na wejściu) należy użyć:

$("#datepicker").datepicker();  
$("#datepicker").mousedown(function() { 
    var cond = $(this).data('datepicker').dpDiv.is(':visible'); 
    $(this).datepicker(cond ? 'hide' : 'show'); 
}); 

Answer 5

Działa to dla mnie (konsola. metoda logu jest wyprowadzana do testowania - usuń do produkcji):

// call addToggleListener function one time to init 
addToggleListener($('.myDatepickerInputs')); 

// the function 
function addToggleListener(elm) 
{ 
    elm.off('mouseup'); 

    elm.on('mouseup', function() 
    { 
     $(this).off('mouseup'); 
     $(this).datepicker("show"); 

     console.log("show"); 

     $(this).on('mouseup', function() 
     { 
      $(this).off('mouseup'); 
      $(this).datepicker("hide"); 
      addToggleListener($(this)); 

      console.log("hide"); 
     }); 
    }); 
} 

Wywołanie funkcji za pomocą datepickerów "onClo se "opcja:

onClose: function() 
{ 
    addToggleListener($(this)); 
} 

Testowane z Google Chrome.