IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

combiner setTimout et l'événement onKeyup


Sujet :

JavaScript

  1. #1
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2003
    Messages
    71
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2003
    Messages : 71
    Par défaut combiner setTimout et l'événement onKeyup
    J'ai besoin d'appeler une fonction javascript sur un champ saisi par l'utilisateur.
    on considère que le user à fini sa saisie aprés une seconde (c un paramètre) d'innactivité.

    Je compte utiliser l'évènement onKeyup (ainsi je pourrait appeler ma fonction qd l'utilisateur saisi qq chose)
    et utiliser setTimeout pour l'attente d'une seconde.

    <input id="id1" name="name1" type="text" onKeyup="setTimeout(mafonction(param), 1000) ; ">
    Je n'ai pas l'impression que le temps d'attente soit prie en compte
    Qu'est ce qui ne va pas?

  2. #2
    Expert confirmé
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 660
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 660
    Par défaut
    bonjour,

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
     
    <input id="id1" name="name1" type="text" onkeyup="setTimeout(function()
    {mafonction(param)}, '1000') ; ">

    mets la durée entre guillemets

  3. #3
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2003
    Messages
    71
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2003
    Messages : 71
    Par défaut
    Non, Auteur apparemment ça n'est pas ça le pb,
    le 2ème paramètre n'est pas une chaine de caractère

  4. #4
    Expert confirmé
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 660
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 660
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    <html>
    <head>
    <script type="text/javascript">
    function test()
    {
    document.getElementById("idTest").innerHTML +="temps écoulé ";
    }
     
    </script>
    </head>
    <body>
     
    <input id="id1" name="name1" type="text" onkeyup="setTimeout('test()', '1000')">
     
    <div id="idTest"></div>
     
    </body>
    </html>
    je n'ai aucun souci avec cet exemple. Les paramètres de setTimeout sont ente guillemets.

  5. #5
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2003
    Messages
    71
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2003
    Messages : 71
    Par défaut
    excuse auteur, l'attente fonctionne bien , j'avais oublié le function(){}
    Par contre du coup j'ai d'autres soucis

  6. #6
    Expert confirmé
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 660
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 660
    Par défaut
    Citation Envoyé par antigone
    excuse auteur, l'attente fonctionne bien , j'avais oublié le function(){}
    Par contre du coup j'ai d'autres soucis
    lesquels ?

  7. #7
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2003
    Messages
    71
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2003
    Messages : 71
    Par défaut
    Dans ma fonction je passe en paramètre la valeur du input

    loadDiv('wns_content.jsp','div1','gc=<%=gc%>&scenario=<%=scenario%>&__srch_expr__='+this.value

    la valeur de mon champ (this.value) ne passe plus

    J'investigue

  8. #8
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2003
    Messages
    71
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2003
    Messages : 71
    Par défaut
    En plus apparemment ce qui se passe c que a chaque fois que je saisie ou efface un caractère, il y a une attente puis un appel a la fonction.c'est à dire que la fonction est appellé pour chaque saisie ou desaisie de carctère.

    Alors que ce que je voulais c'est, une attente de t secondes pour s'assurer que l'utilisateur a fini plus ou moins sa saisie puis le traitement de l'information

    Peut être que je dois appliqer le setTimeout a l'evenement onkeyup (si l'utilisateur saisie qq chose attendre t seconde avant de traiter l'information)

    mais là je ne sais pas comment faire

  9. #9
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    onkeyup="var myparam=this.value; setTimeout(function(){ ...+myparam},1000)
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  10. #10
    Expert confirmé
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 660
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 660
    Par défaut
    regarde le temps écoulé entre down et un up :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    <html>
    <head>
    <script type="text/javascript">
    var chrono=null;
    function up()
    {
    document.getElementById("idTest").innerHTML +="temps écoulé ";
    }
     
    function down()
    {
    if (chrono!=null)
    {
     clearTimeout(chrono);
      chrono=null;
    }
    }
     
    </script>
    </head>
    <body>
     
    <input id="id1" name="name1" type="text" onkeyup="chrono=setTimeout('up()', '1000')" onkeydown="down()">
     
    <div id="idTest"></div>
     
    </body>
    </html>

  11. #11
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2003
    Messages
    71
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2003
    Messages : 71
    Par défaut
    En fait mon code est
    <input id="f-search-group" name="f-search-group" type="text" onKeyup="var myparam=this.value;setTimeout(function(){alert(myparam);
    loadDiv('wns_content.jsp','div1','gc=<%=gc%>&scenario=<%=scenario%>&__srch_expr__='+myparam)},'5000') ; ">
    je l'ai testé et a chaque saisie j'ai un alert avec la valeur de l'input

    Ce que je voulais n'était pas retarder l'appel de la fonction loadDiv.
    Mais attendre qq temps pour permettre à l'utilisateur de saisir son champs avant d'appeler la fonction loadDiv

    C'est a dire pour chaque evenement onKeyup , attendre 5 seconde....

    Dure dure

  12. #12
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par défaut
    enlève les quote pour le 5000 la focntion attend un integer pas un string ...
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  13. #13
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2003
    Messages
    71
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2003
    Messages : 71
    Par défaut
    ça fonctionne aussi avec un string

  14. #14
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par défaut
    peut être sur ton PC avec IE mais le second paramètre de la methode setTimeout doit être un integer, la focntion attend un nombre de millisecondes, pas un string !!!
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  15. #15
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2003
    Messages
    71
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2003
    Messages : 71
    Par défaut
    Mais je fais mes tests sur firefox pour le moment et ca fonctionne bien

    qq saurait-il comment appliquer le setTimout sur un evenement (voir plus haut mon pb)

  16. #16
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par défaut
    ben chez moi je n'ai aucun souci avec ceci :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    function testeur(param){alert(param)}
    </script>
     
    </head>
     
    <body>
    <input type='text' id="coucou" onkeyup="var temp=this.value;setTimeout(function (){testeur(temp);},1000)" />
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  17. #17
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2003
    Messages
    71
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2003
    Messages : 71
    Par défaut
    Dans ton test le setTimeout est appellé pour la fonction alert.

    c a dire que si l'utilisateur saisie "at" en une demi seconde (500)

    il y aura deux appels à la fonction alerts.

    mon but est d'appeler la fonction apres une attente de 1 seconde(1000) par exeple. afin de m'assuer que l'utilisateur a fini sa saisie.

    c a dire qu'il faudrait que j'appaelle settimout sur l'evenement onkeyup

    Ce que je ne sais pas faire

  18. #18
    Expert confirmé
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 660
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 660
    Par défaut
    C'est visiblement passé inaperçu :

    Citation Envoyé par Auteur
    regarde le temps écoulé entre down et un up :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    <html>
    <head>
    <script type="text/javascript">
    var chrono=null;
    function up()
    {
    document.getElementById("idTest").innerHTML +="temps écoulé ";
    }
     
    function down()
    {
    if (chrono!=null)
    {
     clearTimeout(chrono);
      chrono=null;
    }
    }
     
    </script>
    </head>
    <body>
     
    <input id="id1" name="name1" type="text" onkeyup="chrono=setTimeout('up()', '1000')" onkeydown="down()">
     
    <div id="idTest"></div>
     
    </body>
    </html>
    Déclenche la temporisation sur le onkeyup, puis désactive la si un onkeydown a eu lieu dans le temps imparti et dans ce cas la fonction up ne sera pas appelée.

  19. #19
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par défaut
    ha je crois que je commence à entrevoir ton souci ...

    ton problème ne viendrait il pas plutot du fait que la focntion est appelée sur chaque laché de touche ?

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    var delai
    function testeur(param){alert(param)}
    function squeeze(){clearTimeout(delai)}
    </script>
     
    </head>
     
    <body>
    <input type='text' id="coucou" onkeydown="squeeze()" onkeyup="var temp=this.value;delai=setTimeout(function (){testeur(temp);},5000)" />
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

Discussions similaires

  1. Réponses: 7
    Dernier message: 11/03/2013, 22h34
  2. Réponses: 8
    Dernier message: 03/08/2009, 07h36
  3. bug avec événement onKeyUp
    Par maysa dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 21/06/2007, 16h01
  4. Modification de l'évènement OnClick
    Par MrJéjé dans le forum C++Builder
    Réponses: 9
    Dernier message: 22/08/2002, 12h52
  5. Redéfinir l'événement OnExit de mon composant TEditFloat
    Par Seb des Monts dans le forum C++Builder
    Réponses: 5
    Dernier message: 18/06/2002, 16h10

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo