jQuery Datepicker - schließen Sie auf Eingabe klicken Sie auf

Ich bin mit jQuery Datepicker und ich habe ein kleines problem.

Wenn der datepicker wird geöffnet, und klicken Sie auf das Eingabefeld erneut, nichts passiert.
Wie kann ich das ändern.. das picker geschlossen werden, die auf Eingabe klicken Sie auf, wenn es bereits geöffnet ist ?

Vielen Dank im Voraus...

wie wollen Sie initialaze datepicker?

InformationsquelleAutor Filip | 2010-09-11

  1. 6

    Da es gebunden ist, zu focus (standardmäßig), können Sie einfach binden Sie Ihr eigenes .mousedown() - handler und es wird nicht stören, wie diese:

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

    Sie können es hier versuchen. Ich bin mit mousedown denn das ist, wie es ist in der Nähe Verhalten erkannt wird, also nur konsequent, mehr Zukunftssicherheit dieses Verhalten.

    InformationsquelleAutor Nick Craver

  2. 17

    Ich einen besseren Weg gefunden. ausblenden zu verursachen scheint es nicht zu öffnen, auf weiter klickt. Und Weichzeichnen bewirkt, dass die Datumsauswahl zu öffnen, eine Sekunde später.

    Ich verwendet toggle:

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

    InformationsquelleAutor mbdev

  3. 2

    Da kann ich nicht kommentieren, aber...

    Eine lästige Sache ist, da der datepicker verwendet konzentrieren, sobald Sie sich zu verstecken, können Sie es nicht wieder, ohne zu verwischen und erst dann fokussieren (so klicken Sie irgendwo auf, dann klicken Sie erneut).

    Ich löste dies durch hinzufügen der folgenden Nick Craver ' s Antwort (innerhalb der mousedown):

    $(this).blur();

    Also es sollte wie folgt Aussehen:

    $("#datepicker").datepicker();
$("#datepicker").mousedown(function() {
    $(this).datepicker("hide");
    $(this).blur();
});
    Für mich ist das einfach öffnet die Datumsauswahl wieder

    InformationsquelleAutor davertron

  4. 1

    Dies funktioniert für mich (Konsole.log-Methode ist die Ausgabe für die Prüfung – entfernen Sie für die Produktion):

    //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" );
        });
    });
}

    Aufruf der Funktion mit dem datepickers „onClose“ - option:

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

    Getestet mit Google Chrome.

    Hi @peterblunt, ich danke Ihnen sehr für Ihre Antwort. Es auch für mich funktioniert, aber nur ohne den Aufruf der Funktion onClose. Ich habe eine Frage, ist es möglich, das gleiche zu tun für mehrere datepickers? Ich habe zwei datepickers auf einer Seite, wie dieser code funktioniert nur für die erste. Ich würde wirklich zu schätzen Ihre Antwort.
    Sollten alle eingeleiteten datepicker-Eingänge, mit Klasse 'myDatepickerInputs' (in diesem Beispiel). Es nochmal getestet – sagen, es funktioniert. Vielleicht, weil Sie das nicht mit dem 'onClose' option für den Aufruf 'addToggleListener'? Grüße.

    InformationsquelleAutor peterblunt

  5. 0

    Um mehr zu arbeiten, dann eine Zeit (klicken Sie mehrmals auf den input), die Sie verwenden sollten:

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

    InformationsquelleAutor n_ilievski

Schreibe einen Kommentar