今日、js 遅延イベントを作成していたときに、setTimeout メソッドで jquery の $(this) を使用しても機能しないことがわかりました。さまざまなテストを行った結果、最終的に jquery のセレクターは setTimeout でサポートされていないという結論に達しました。そこで、QQ で jquery 開発の専門家にアドバイスを求めたところ、すぐに問題が解決されました。ここに記録します。
以下は遅延処理を行う際に作者が使用した js コードです:
$('.dl_select dt').hover( function(){ clearTimeout(t3); $(this).siblings('dd').css({'display':'block','cursor':'pointer'}); }, function(){ t2=setTimeout(function(){$(this).siblings('dd').css({'display':'none'});},300); } ); $('.dl_select dd').hover( function(){ clearTimeout(t2); $(this).css({'display':'block','cursor':'pointer'}); }, function(){ t3=setTimeout(function(){$(this).css({'display':'none'});},200); } );
上記のコードのsetTimeoutのコードに注意してください。これらのコードがこのメソッド内に存在しない場合、それ自体は問題ありませんが、この場合、エラーが報告されます。その理由については、作者はまだ解明していません。ネットユーザーの啓発を受けて、以下のように変更しました。この方法は非常に賢いです。正しいコードは次のとおりです:
$('.dl_select dt').hover( function(){ clearTimeout(t3); $(this).siblings('dd').css({'display':'block','cursor':'pointer'}); }, function(){ var $this=$(this).siblings('dd'); t2=setTimeout(function(){$this.css({'display':'none'});},300); } ); $('.dl_select dd').hover( function(){ clearTimeout(t2); $(this).css({'display':'block','cursor':'pointer'}); }, function(){ var $this=$(this); t3=setTimeout(function(){$this.css({'display':'none'});},200); } );
以上がこの記事の全内容です。皆さんに気に入っていただければ幸いです。