comment se lier à la fois flou et de changement, mais seulement déclencher une fonction une fois en Jquery/Javascript?

Je suis en train de déclencher une fonction lorsque vous sélectionnez un élément est modifié.

Depuis l'Ipad est d'avoir du mal avec le ("changement"), j'ai aussi envie de se lier à 'blur', qui fonctionne très bien sur Ipad.

Mais je ne veux pas les deux événements pour déclencher la fonction deux fois, donc j'ai besoin d'une sorte de crochet pour s'assurer si les deux changement et flou déclencheur, que la fonction sous-jacente n'est déclenché une fois.

C'est ce que je fais maintenant, mais ... c'est pas très agréable:

//make sure binding is only assigned once
var compSel = $('#my_select');
if ( compSel.jqmData('bound') != true ){
    console.log("bound");
    compSel.jqmData('bound', true)
        .on( $.support.touch ? 'blur' : 'change', function(){
            console.log("trigger");
            //run function xyz
        })
    }

Cela fonctionne si vous pouvez vivre avec tous palpable périphériques à faire avec flou.

Question:

Quelqu'un a une meilleure idée de faire en sorte de flou et de changement de déclencher une fonction à la fois?

Merci pour l'aide!

OriginalL'auteur frequent | 2012-07-05

  1. 25

    Essayer de créer une fonction, lié à ces deux événements, et l'ajout d'un délai d'attente pour appeler la fonction. De cette façon, si la fonction est appelée plusieurs fois, il sera exécuté qu'une fois.

    Quelque chose comme ceci (vous pouvez régler le délai d'attente si nécessaire):

    function blurChange(e){
    clearTimeout(blurChange.timeout);
    blurChange.timeout = setTimeout(function(){
        //Your event code goes here.
    }, 100);
}

$('#my_select').on('blur change',blurChange);
    +1 Cela devrait fonctionner
    yah. Aussi l'approche que je vais prendre. Merci!
    Si l'action d'ouvrir une nouvelle page, une fois l'utilisateur de revenir à la page d'origine, le délai sera écoulé et en cliquant sur la page, il va déclencher l'effet de flou de l'événement.

    OriginalL'auteur Rocket Hazmat

  2. 4

    ne sais pas à propos de l'ipad, mais sur le navigateur peut-être quelque chose comme ceci 

    $("#dataTable tbody").on("click blur", "tr", function(event){
        if (event.type == "click")
        { 
        //do stuff
        }
        else
        {
        //do nothing
        }
});
    aussi une bonne idée. nous allons voir

    OriginalL'auteur max4ever

  3. 0

    Ce n'est pas agréable, mais vous pouvez appeler pour change dans le blur fonction, et de faire tous les trucs dans le change fonction:

    ...
$(document).on("change", "#yourelement", function(){
    //do your stuff
});
....
$(document).on("blur", "#yourelement", function(){
    $("#yourelement").change();
    //alternatively, you can trigger the change event
    //$("#yourelement").trigger("change");
});

    Il n'a pas l'air bien, mais je pense que cela devrait fonctionner.

    EDIT: Si le navigateur lance les deux événements (le flou et le changement), ce code appel deux fois à la change fonctionnalité. Je pense que vous pouvez obtenir ce comportement avec une sorte de drapeau:

    var executed = false;
...
$(document).on("change blur", "#yourelement", function(){
    if(!executed){
        executed = true;
        //do your stuff
    }
});
    hm. de les essayer. thx jusqu'à présent
    IMO, si vous faites ce changement et le flou peut encore être appelé depuis Le changement est encore déclaré. Le changement peut être déclenchée par itselft et par le flou de la fonction.
    vous êtes complètement à droite

    OriginalL'auteur Vithozor

  4. 0

    Joindre plusieurs événements vous pouvez l'utiliser comme ça aussi

    <select class="form-control" id="Category" name="Category" required>
   <option value="">Choose an option</option> 
   <option value="1">Your Text</option> 
</select>
<p class=""></p>

$( "#Category" ).on( "blur change", function( event ) {
    if($(this).val()===""){
            $(this).next().text("Please choose category").css("color","#a94442");
        }
        else
        {
            $(this).next().text("");
        }

});

    OriginalL'auteur Vivek

  5. 0

    Dans le cas que les deux événements sont toujours déclenché, nous pouvons définir un indicateur pour le premier déclencheur et d'exécuter le script. Le deuxième déclenchement de voir le drapeau et clair, et le retourner de sorte qu'il s'exécute uniquement la première fois.

    Dans ce cas, vous pouvez flou plusieurs fois sans faire un changement, de sorte qu'il ne fonctionnera que toutes les autres fois. Si il y a un changement, alors il devrait fonctionner pour sûr (si l'indicateur est allumé ou éteint).

    $(document).on("change blur",".selector", function(){

    if($(this).data("triggered") == "1"){
        $(this).data("triggered","0");
        return;
    }
    $(this).data("triggered","1");

    //your script here

    //fix for "every other time" issue described above
    var el = $(this);
    setTimeout(function(){ el.data("triggered","0"); }, 200);
}
    • Vous pourriez envisager de la "contribution" de l'événement, si vous voulez détecter un changement avant que l'utilisateur quitte l'élément.
    • Vous pourriez aussi envisager d'écrire le script, de sorte qu'il est sûr d'exécuter plusieurs fois (la quantité) et assez efficace qu'il n'affecte pas les performances si elle s'exécute deux fois.

    OriginalL'auteur Frank Forte

  6. -4

    Vous pouvez lier à plusieurs événements en même temps:

    $(document).on('blur change','#mySelector',function(){
    //this is called on either
});
    Mais si vous avez changé l'élément et le flou de l'élément dans le même temps, à la fois le feu et la fonction sera exécutée deux fois, ce qui n'est souvent pas ce que vous voulez.

    OriginalL'auteur bokonic