JQuery入門——事件切換之hover()方法應(yīng)用介紹
更新時(shí)間：2013年02月05日 16:03:42 作者：
謂切換事件，即有兩個(gè)以上的事件綁定于一個(gè)元素，在元素的行為動(dòng)作間進(jìn)行切換,有兩個(gè)方法用于事件的切換，一個(gè)方法是hover()，另一個(gè)是toggle(),感興趣的朋友不妨了解下,或許對(duì)你有所幫助
1、在JQuery中，有兩個(gè)方法用于事件的切換，一個(gè)方法是hover()，另一個(gè)是toggle()。所謂切換事件，即有兩個(gè)以上的事件綁定于一個(gè)元素，在元素的行為動(dòng)作間進(jìn)行切換。如一個(gè)超級(jí)鏈接標(biāo)記<a>若想實(shí)現(xiàn)當(dāng)鼠標(biāo)懸停時(shí)觸發(fā)一個(gè)事件，鼠標(biāo)移出時(shí)又觸發(fā)一個(gè)事件，可以用切換事件輕松實(shí)現(xiàn)。
2、示例代碼：
復(fù)制代碼 代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>切換事件hover</title>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function(){
$(".clsTitle").hover(function(){
$(".clsContent").show();
},
function(){
$(".clsContent").hide();
})
})
</script>
</head>
<body>
<div class="clsTitle">JQuery簡(jiǎn)介</div>
<div class="clsContent">JQuery是由美國(guó)人John Resig于2006年創(chuàng)建的一個(gè)開源項(xiàng)目，它的主旨是：以更少的代碼，實(shí)現(xiàn)更多的功能</div>
</body>
</html>
3、效果圖預(yù)覽：
當(dāng)鼠標(biāo)移動(dòng)到JQuery簡(jiǎn)介時(shí)：
相關(guān)文章
這篇文章主要介紹了jQuery彈出遮罩層效果,結(jié)合完整實(shí)例形式分析了jQuery遮罩層的動(dòng)態(tài)創(chuàng)建與使用技巧,需要的朋友可以參考下2016-09-09
jquery ajax的success回調(diào)函數(shù)中實(shí)現(xiàn)按鈕置灰倒計(jì)時(shí)
實(shí)現(xiàn)異步手機(jī)發(fā)送短信成功之后在ajax的success回調(diào)中實(shí)現(xiàn)將發(fā)送按鈕置灰并倒計(jì)時(shí)，具體的實(shí)現(xiàn)示例如下，喜歡的朋友可以研究下2013-11-11
有關(guān)jquery與DOM節(jié)點(diǎn)操作方法和屬性記錄
下面小編就為大家?guī)?lái)一篇有關(guān)jquery與DOM節(jié)點(diǎn)操作方法和屬性記錄。小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考2016-04-04
這篇文章主要介紹了jQuery可見性過濾選擇器用法,結(jié)合實(shí)例形式分析了jQuery針對(duì)元素hidden屬性的過濾操作相關(guān)技巧,需要的朋友可以參考下
2016-09-09 
PHP+jQuery+Ajax實(shí)現(xiàn)多圖片上傳效果
我們?cè)诒疚闹杏玫揭粋€(gè)Ajax表單提交插件：jqery.form.js，有高人修改了幾行代碼并改名為：jquery.wallform.js，直接拿來(lái)用。下面我們就來(lái)看看這款神奇的jQuery插件吧。
2015-03-03 
jquery解析XML及獲取XML節(jié)點(diǎn)名稱的實(shí)現(xiàn)代碼
下面小編就為大家?guī)?lái)一篇jquery解析XML及獲取XML節(jié)點(diǎn)名稱的實(shí)現(xiàn)代碼。小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧
2016-05-05 
這篇文章主要介紹了jQuery讀取XML文件的方法,結(jié)合實(shí)例形式分析了jQuery基于ajax針對(duì)xml文件的讀取操作相關(guān)技巧,需要的朋友可以參考下
2017-02-02 
jQuery彈出下拉列表插件（實(shí)現(xiàn)kindeditor的@功能）
這篇文章主要介紹了jQuery彈出下拉列表插件（實(shí)現(xiàn)kindeditor的@功能）的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2016-08-08 
jQuery 頁(yè)面 Mask實(shí)現(xiàn)代碼
何為頁(yè)面 Mask (遮罩)？看過 jQuery 的 Lightbox 插件的一定不會(huì)陌生。就是在頁(yè)面上建一個(gè)透明層遮蓋住頁(yè)面的全部?jī)?nèi)部。
2010-01-01