JQuery入門——用映射方式綁定不同事件應用示例
更新時間：2013年02月05日 16:09:31 作者：
通過映射的方式，給對象綁定多個事件,可能有很多的童鞋們不從使用過，不過，沒有關系本文將一一為您詳細介紹，感興趣的朋友可不要錯過了啊，希望本文對你有所幫助
1、通過映射的方式，給對象綁定多個事件。
2、示例代碼：
復制代碼 代碼如下:
<!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>映射方式綁定不同事件</title>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function(){
$(".txt").bind({focus:function(){
$("#divTip").show().html("執(zhí)行的是focus事件");
},
change:function(){
$("#divTip").show().html("執(zhí)行的是change事件");
}
})
})
</script>
</head>
<body>
<div>姓名：<input type="text" class="txt"/></div>
<div id="divTip" class="clsTip"></div>
</body>
</html>
3、效果圖預覽：
將光標置于文本框中點擊顯示效果如下：
在文本框中輸入內容然后將光標單擊其他空白頁面效果如下：
相關文章
基于JQuery和CSS3實現仿Apple TV海報背景視覺差特效源碼分享
這是一款效果非常炫酷的jQuery和CSS3仿Apple TV海報背景視覺差特效。該視覺差特效在使用鼠標在屏幕上下左右移動的時候，海報中的各種元素以不同的速度運動，形成視覺差效果，并且還帶有一些流光特效。2015-09-09
這篇文章介紹了使用Jquery操作Cookies的方法，文中通過示例代碼介紹的非常詳細。對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-05-05
用JavaScript解析XML數據是常見的編程任務，JavaScript能做的，JQuery當然也能做。下面我們來總結幾個使用JQuery解析XML的例子2014-03-03
Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法總結
本文是對Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用進行了詳細的總結介紹，需要的朋友可以過來參考下，希望對大家有所幫助2013-11-11
jqPlot是 一款基于jquery類庫的圖標繪制插件。通過jqPlot可以再網頁中繪制線狀、柱狀、餅狀等多種樣式圖表。而且，jqPlot具有插件可擴展性 (Pluggability)，你可以編寫自己的圖表樣式2012-10-10
相信大家在一些網站都看到過這種效果吧，當鼠標放在新聞列表一行的時候，整行就會變色，雖然使用CSS也能夠實現此種功能，但是由于眾多瀏覽器版本對于CSS3并沒有良好的支持，所以在當前情況下，使用jQuery實現此種功能是一個不錯的選擇2015-12-12
jQuery中delegate和on的用法與區(qū)別詳細解析
本篇文章主要是對jQuery中delegate和on的用法與區(qū)別進行了詳細的介紹，需要的朋友可以過來參考下，希望對大家有所幫助2014-01-01
這篇文章主要介紹了jQuery前端開發(fā)35個小技巧的相關資料，非常實用,需要的朋友可以參考下2016-05-05
jquery插件jquery.dragscale.js實現拖拽改變元素大小的方法(附demo源碼下載)
這篇文章主要介紹了jquery插件jquery.dragscale.js實現拖拽改變元素大小的方法,涉及jquery針對鼠標事件的響應及頁面元素動態(tài)操作的相關技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2016-02-02
jquery實現的代替?zhèn)鹘y(tǒng)checkbox樣式插件
這篇文章主要介紹了jquery實現的代替?zhèn)鹘y(tǒng)checkbox樣式插件,可實現滑動選擇的效果,需要的朋友可以參考下2015-06-06