jQueryマウスイベントとは何ですか?

一个新手
リリース: 2017-09-11 10:27:52
オリジナル
1861 人が閲覧しました

マウス イベントは、ユーザーがマウス カーソルを移動するか、マウス ボタンをクリックするとトリガーされます。

1. クリックイベント: マウスの左ボタンがクリックされたときにトリガーされます

  $('p').click(function(){});
ログイン後にコピー

例:

$('p').click(function(){
        alert('click function is running !');
       });
ログイン後にコピー

2. dbclick イベント: 2 回連続してクリックされたときにトリガーされます

$('p')。 dbclick(function (){});

例:

$("button").dblclick(function(){
 $("p").slideToggle();
});
ログイン後にコピー

3. Mousedown イベント: マウスが押されたときにトリガーされます

$('p').mousedown(function(){});

$("button").mousedown(function(){
 $("p").slideToggle();
});
ログイン後にコピー

4. Mouseup イベント: マウスが離されたときにトリガーされます

$('p').mouseup(function(){});

例:

$("button").mouseup(function(){
 $("p").slideToggle();
});
ログイン後にコピー

5. Mouseover イベント: マウスある要素から別の要素へ移動 要素のタイミングでトリガー

mouseoutイベント: マウスが要素の外へ移動したときにトリガー

 $('p').mouseover(function(){});
 $('p').mouseout(function(){});
ログイン後にコピー

例:

$("p").mouseover(function(){
 $("p").css("background-color","yellow");
});
$("p").mouseout(function(){
 $("p").css("background-color","#E9E9E4");
});
ログイン後にコピー

6、mouseenterイベント: マウスが要素内に移動したときにトリガー

mouseleaveイベント: マウスが要素の外に移動するとトリガーされます

    $('p').mouseenter(function(){});
  $('p').mouseleave(function(){});
ログイン後にコピー

Example

$("p").mouseenter(function(){
 $("p").css("background-color","yellow");
});
$("p").mouseleave(function(){
 $("p").css("background-color","#E9E9E4");
});
ログイン後にコピー

7、hoverイベント

 $('p').hover(
    function(){},
    function(){}
  );
ログイン後にコピー

Example

$(".table_list tr").hover( 
function () { 
$(this).addClass("hover"); 
}, 
function () { 
$(this).removeClass("hover"); 
} 
);
ログイン後にコピー

8、toggleイベント: マウスクリック切り替えイベント

 $('p').toggle(
    function(){},
    function(){}
  );
ログイン後にコピー

$("p").toggle(
 function(){
 $("body").css("background-color","green");},
 function(){
 $("body").css("background-color","red");},
 function(){
 $("body").css("background-color","yellow");}
);
ログイン後にコピー

以上がjQueryマウスイベントとは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート