Javascript：onClickイベントの2回のクリックが必要onMouseOverハンドラ

Question

私はNetflix/Amazonスタイルの星評価システムを持っています。したがって、星は一時的にonMouseOverを点灯させ、クリックはPHPコールとスターカラーの永続的な変更を引き起こすはずです。

すべての機能は動作しますが、2回目のクリックまではonClickイベントは発生しません。これは、onMouseOverイベントが終了アクション（onMouseOutまたはクリック）を検出するまで、onMouseOverイベントがまだアクティブ化されているためです。

似たような質問がありましたが、オンポイントの回答はありませんでした。

ありがとうございます！

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; 
     } 
} 

Answer 1

onMouseOverイベントがtrueを返すようにしてください。

Answer 2

マウスオーバーで表示を変更する必要があるときは、通常、代わりにマウスカーソルを使用することをお勧めします。