Javascript: événement onClick nécessitant deux clics b/c du gestionnaire onMouseOver

J'ai un système de classement par étoiles Netflix/Amazon. Ainsi, les étoiles s'allument temporairement sur MouseOver et un clic est supposé déclencher un appel PHP et un changement permanent de la couleur des étoiles.Javascript: événement onClick nécessitant deux clics b/c du gestionnaire onMouseOver

Tout fonctionne, bien que l'événement onClick ne soit pas déclenché avant le deuxième clic. Il semble que cela soit dû au fait que l'événement onMouseOver est toujours activé jusqu'à ce qu'il rencontre une action de fin (onMouseOut ou un clic).

J'ai déjà vu des questions similaires, mais pas de réponses précises.

Merci!

function rate(img_name,action,headlineid,userid,rating) { 
     var baseurl='http://www.mysite.com/images/'; 
    var imgoff='atcstar3.gif'; 
     var imghover='atcstar.gif'; 
     var imgon='atcstar.gif'; 
    imgname=img_name; 
     hid=headlineid; 
var current=document.getElementById(img_name).src; 
     var star=img_name.replace(hid+'-star',''); 


     switch (action) { 
       case 'hover': 
           for (i=1;i<=star;i++) { 
             document.getElementById(hid+'-star'+i).src=baseurl+imghover; 
           } 
         break; 

       case 'click': 
         if (current!=baseurl+imgon) { 
           for (i=1;i<=star;i++) { 
             document.getElementById(hid+'-star'+i).src=baseurl+imgon; 
           } 

           current=baseurl+imgon; 

           xmlHttp=GetXmlHttpObject() 
           if (xmlHttp==null) 
           { 
           alert ("Browser does not support HTTP Request") 
           return 
           } 

           if (getCookie("votes")=="") { 
            setCookie("votes",hid+'-'+star,3); 
           } else { 
             votes=getCookie("votes") 
             votes=votes+","+hid+'-'+star 
             setCookie("votes",votes,3); 
           } 


           var url="rate.php?"; 
           url=url+"headlineid="+hid; 
           url=url+"&userid="+userid; 
           url=url+"&rating="+star; 
           url=url+"&sid="+Math.random(); 
         xmlHttp.onreadystatechange=stateChangedRateStory; 
           xmlHttp.open("GET",url,true); 
           xmlHttp.send(null); 
         newrank=star; 




         } else { 
          document.getElementById(img_name).src=baseurl+imgoff; 
           current=baseurl+imgoff; 
         } 
         break; 
       case 'out': 

         if (current!=baseurl+imgon || (newrank!=star && rating<star)) { 
           for (i=5;i>=rating+1;i--) { 
             //document[hid+'-star'+i].src=baseurl+imgoff; 
             document.getElementById(hid+'-star'+i).src=baseurl+imgoff; 
           } 
         } 

         break; 
     } 
}

Source

2009-08-24 Scott Lay

Et vous nous montrez votre code? – Cleiton

Essayé d'ajouter retour vrai. Je peux juste devoir séparer les fonctions (avoir une fonction manipulant trois événements, avec un commutateur les triant dehors). –

Essayez d'afficher l'événement onMouseOver true.

Source

2009-08-24 03:21:50 helloandre

Chaque fois que j'ai besoin de l'affichage pour passer à la souris, je préfère généralement utiliser l'élément CSS: hover à la place.

Source

2009-08-24 03:32:44 RichN

Tout comme moi, mais je le contrôle en contrôlant l'apparence des autres objets (les étoiles sont plus basses que celle qui est planée), et le changement d'apparence est conditionnel (que le vote ait été ou non jeté auparavant). Je ne pense pas que je peux le faire avec CSS. –

Javascript: événement onClick nécessitant deux clics b/c du gestionnaire onMouseOver

Répondre

Questions connexes