wiki:javascript:jquery:jquery_note:jquery_events

차이

문서의 선택한 두 판 사이의 차이를 보여줍니다.

차이 보기로 링크

--- wiki:javascript:jquery:jquery_note:jquery_events [2021/04/15 13:58]
emblim98 [예제]
+++ wiki:javascript:jquery:jquery_note:jquery_events [2023/01/13 18:44] (현재)
@@ 줄 1: / 줄 1: @@
 ======jQuery Event Methods======
-<WRAP left notice 80%>
+<WRAP left notice 70%>
   * description : jQuery Event Methods
   * author      : 오션
@@ 줄 28: / 줄 28: @@
 | mouseenter    | keyup            | focus        | scroll                  |
 | mouseleave    |                  | blur         | unload                  |
-\\
 =====jQuery Syntax For Event Methods=====
 %%jQuery%%에서, 대부분의 %%DOM%% 이벤트에는 동일한 %%jQuery%% 메서드가 있습니다.\\
@@ 줄 45: / 줄 45: @@
 });
 </code>
+\\
 ======Commonly Used jQuery Event Methods======
 =====$(document).ready()=====
@@ 줄 144: / 줄 144: @@
 ====예제====
 <code jquery>
-$("#p1").hover(function() {
+    $(document).ready(function () {
-  alert("Ypu entered p1!);
+      $("#p1").hover(function () {
-},
+        alert("You entered p1!");
-function() {
+      },
-  alert("Bye! You now leave p1!");
+        function () {
-});
+          alert("Bye! You now leave p1!");
+        });
+    });
 </code>
@@ 줄 159: / 줄 161: @@
 ====예제====
 <code jquery>
-$("input").focus(function() {
+    $(document).ready(function () {
-  $(this).css("background-color", "#cccccc");
+      $("input").focus(function () {
-});
+        $(this).css("background-color", "yellow");
+      });
+      $("input").blur(function () {
+        $(this).css("background-color", "green");
+      });
+    });
 </code>
@@ 줄 171: / 줄 178: @@
 ====예제====
 <code jquery>
-$("input").blur(function9) {
+$("input").blur(function() {
   $(this).css("background-color", "#ffffff");
 });
@@ 줄 183: / 줄 190: @@
 ====예제====
 <code jquery>
-$("p").on("click", function() {
+    $(document).ready(function () {
-  $(this).hide();
+      $("p").on("click", function () {
-});
+        $(this).hide();
+      });
+    });
 </code>
 \\
@@ 줄 192: / 줄 201: @@
 ====예제====
 <code jquery>
-$("p").on({
+    $(document).ready(function () {
-  mouseenter: function() {
+      $("p").on({
-    $(this).css("background-color", "lightgray");
+        mouseenter: function () {
-  },
+          $(this).css("background-color", "lightgray");
-  mouseleave: function() {
+        },
-    $(this).css("background-color", "lightblue");
+        mouseleave: function () {
-  },
+          $(this).css("background-color", "lightblue");
-  click: function() {
+        },
-    $(this).css("background-color", "yellow");
+        click: function () {
-  }
+          $(this).css("background-color", "yellow");
-});
+        }
+      });
+    });
 </code>

/var/services/web/dokuwiki/data/attic/wiki/javascript/jquery/jquery_note/jquery_events.1618462699.txt.gz · 마지막으로 수정됨: 2022/03/10 19:52 (바깥 편집)