JQuery入門——事件切換之hover()方法應(yīng)用介紹
更新時(shí)間：2013年02月05日 16:03:42 作者：
謂切換事件，即有兩個(gè)以上的事件綁定于一個(gè)元素，在元素的行為動作間進(jìn)行切換,有兩個(gè)方法用于事件的切換，一個(gè)方法是hover()，另一個(gè)是toggle(),感興趣的朋友不妨了解下,或許對你有所幫助
1、在JQuery中，有兩個(gè)方法用于事件的切換，一個(gè)方法是hover()，另一個(gè)是toggle()。所謂切換事件，即有兩個(gè)以上的事件綁定于一個(gè)元素，在元素的行為動作間進(jìn)行切換。如一個(gè)超級鏈接標(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簡介</div>
<div class="clsContent">JQuery是由美國人John Resig于2006年創(chuàng)建的一個(gè)開源項(xiàng)目，它的主旨是：以更少的代碼，實(shí)現(xiàn)更多的功能</div>
</body>
</html>
3、效果圖預(yù)覽：
當(dāng)鼠標(biāo)移動到JQuery簡介時(shí)：
相關(guān)文章
這篇文章主要介紹了jquery復(fù)選框多選賦值給文本框的方法,涉及jQuery相關(guān)選擇器的使用技巧,需要的朋友可以參考下2015-01-01
這篇文章主要為大家詳細(xì)介紹了基于jquery實(shí)現(xiàn)三級下拉菜單的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-05-05
jQuery插件FusionCharts實(shí)現(xiàn)的MSBar3D圖效果示例【附demo源碼】
這篇文章主要介紹了jQuery插件FusionCharts實(shí)現(xiàn)的MSBar3D圖效果,結(jié)合完整實(shí)例形式分析了jQuery使用FusionCharts載入xml數(shù)據(jù)繪制MSBar3D圖的相關(guān)操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03
使用jquery組件qrcode生成二維碼及應(yīng)用指南
這篇文章主要介紹了使用jquery組件qrcode生成二維碼及應(yīng)用指南,非常全面實(shí)用，需要的朋友可以參考下2015-02-02
這篇文章主要為大家詳細(xì)介紹了jQuery無縫輪播圖代碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-12-12
jQuery+Ajax+js實(shí)現(xiàn)請求json格式數(shù)據(jù)并渲染到html頁面操作示例
這篇文章主要介紹了jQuery+Ajax+js實(shí)現(xiàn)請求json格式數(shù)據(jù)并渲染到html頁面操作,結(jié)合實(shí)例形式分析了jQuery+Ajax請求json格式數(shù)據(jù)并渲染到html頁面相關(guān)步驟與操作技巧,需要的朋友可以參考下2020-06-06
基于JQUERY的兩個(gè)ListBox子項(xiàng)互相調(diào)整的實(shí)現(xiàn)代碼
基于JQUERY的兩個(gè)ListBox子項(xiàng)互相調(diào)整的實(shí)現(xiàn)代碼，需要的朋友可以參考下。2011-05-05
本篇文章是對jQuery中的折疊面板進(jìn)行了詳細(xì)的分析介紹，需要的朋友參考下2013-06-06
禁止選中文字在某些時(shí)候還是蠻有必要的，比如不想讓他人復(fù)制自己的文章之類的，下面為大家介紹下具體的實(shí)現(xiàn)方，而且兼容目前主流瀏覽器2013-09-09
JQueryEasyUI框架下的combobox的取值和綁定的方法
這篇文章主要介紹了JQueryEasyUI框架下的combobox的取值和綁定的方法,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下。2017-01-01