跳過JS直接JQUERY,“不愧是你”。 對就是我。 今天開始jQuery學習第一天。 click事件方法: 滑鼠點擊 dbl事件方法: 雙擊滑鼠 mouseenter事件方法: 滑鼠進入 mouseleave事件方法: 滑鼠離開 hover: 游標懸停,多一個css可以產生和mouseenter、 ...
跳過JS直接JQUERY,“不愧是你”。
對就是我。
今天開始jQuery學習第一天。
click事件方法:
滑鼠點擊
dbl事件方法:
雙擊滑鼠
mouseenter事件方法:
滑鼠進入
mouseleave事件方法:
滑鼠離開
hover:
游標懸停,多一個css可以產生和mouseenter、mouseleave接近的效果
alert:
彈出一個框
在事件之後。
keydown - 鍵按下的過程,變yellow
keypress - 鍵被按下,可用計數
keyup- 鍵被鬆開,變pink
submit事件方法:
當提交表單時,會發生 submit 事件。
該事件只適用於 <form> 元素。
submit() 方法觸發 submit 事件,或規定當發生 submit 事件時運行的函數。
1 $(document).ready(function(){ 2 $("form").submit(function(){ 3 alert("提交"); 4 }); 5 });
拓展:
1 $(document).ready(function(){ 2 $("form").submit(function(event){ 3 event.preventDefault(); 4 alert("不許提交"); 5 }); 6 });
event.preventDefault阻止
change事件方法:
1 $(document).ready(function(){ 2 $("input").change(function(){ 3 alert("文本已被修改"); 4 }); 5 });
input改變時,彈出alert
當元素的值改變時發生 change 事件(僅適用於表單欄位)。
change() 方法觸發 change 事件,或規定當發生 change 事件時運行的函數。
註意:當用於 select 元素時,change 事件會在選擇某個選項時發生。當用於 text field 或 text area 時,change 事件會在元素失去焦點時發生。
拓展:onchange 事件會在域的內容改變時發生。
$(document).ready(function(){ $("button").click(function(){ $("input").change(); }); }); </script> </head> <body> <p>點擊按鈕觸發 change 事件 (即使元素沒有改變)。</p> <button>輸入框中觸發 change 事件</button> <p>輸入你的名字: <input value="Runoob" onchange="alert(this.value)" type="text"></p>
focus事件方法:
當元素獲得焦點時(當通過滑鼠點擊選中元素或通過 tab 鍵定位到元素時),發生 focus 事件。
focus() 方法觸發 focus 事件,或規定當發生 focus 事件時運行的函數。
提示:該方法通常與 blur() 方法一起使用。
使用,點擊input框或者其他TAP獲取焦點,產生事件的方法
<script> $(document).ready(function(){ $("input").focus(function(){ $("span").css("display","inline").fadeOut(2000); }); }); </script> <style> span { display:none; } </style> </head> <body> <input> <span>請輸入你的電話號碼?</span> <p>點擊輸入框獲取焦點。</p> </body> </html>
blur事件方法:
失去焦點,和focus方法對應,把$("span").focus換成$("span").blur就可以產生相反作用。
1 $(document).ready(function(){ 2 $("input").blur(function(){ 3 alert("輸入框失去了焦點"); 4 }); 5 }); 6 </script> 7 </head> 8 <body> 9 10 輸入你的名字: <input type="text"> 11 <p>在輸入框寫些東西,然後點擊輸入框外,讓其失去焦點。</p> 12 13 </body> 14 </html>
Load事件:
當指定的元素已載入時,會發生 load 事件。
該事件適用於任何帶有 URL 的元素(比如圖像、腳本、框架、內聯框架)以及 window 對象。
根據不同的瀏覽器(Firefox 和 IE),如果圖像已被緩存,則也許不會觸發 load 事件。
鑒於3.0.0以上版本已廢棄,就不再贅述