<!DOCTYPE HTML ><HTML LANG = "EN" ><ヘッド><メタ 文字セット = "UTF-8" ><メタ 名 = 「ビューポート」 コンテンツ = 「幅=装置幅、初期の規模= 1.0」 ><META HTTP-当量 = "X-UA-互換性のある" コンテンツ = "IE =エッジ" ><タイトル> 評価の効果 </ TITLE><スクリプト SRC = "../js/jquery.min.js" > < / SCRIPT><スタイル>ul li{ padding: 0; list-style: none}li{ width: 30px; height: 30px; border: 1px solid #333; float: left; margin-right: 10px}< /style></head><body><ul class= "ul01" ><li></li><li></li><li></li><li></li></ul><script>$( function(){$( "li").on({mouseover: function(){if($( this).css( "backgroundColor") == '#ff0000'){$( this).css( "background", "");console.log($( this).css( "backgroundColor"))} else{$( this).css( "background", "red").prevAll( "li").css( "background", "red");console.log($( this).css( "backgroundColor"))}},mouseout: function(){$( this).css( "background", "")},click: function(){$( this).off( "mouseout")$( this).css( "background", "red").prevAll( "li").css( "background", "red");}})})< /script></body></html>
複数のイベントをバインドする方法)(上JQ
おすすめ
転載: www.cnblogs.com/hilxj/p/11110129.html
おすすめ
ランキング