Jquery注冊(cè)事件實(shí)現(xiàn)方法
本文實(shí)例講述了Jquery注冊(cè)事件實(shí)現(xiàn)方法。分享給大家供大家參考。具體如下:
<!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 src="jquery-1.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
var oldColor;
$(function () {
//注冊(cè)ID為btnTest的按鈕的click事件
$("#btnTest").click(function () {
var $divs = $("div");
$divs.html("我是修改后的Div文本");
});
//注冊(cè)ID為btnTest的按鈕的mouseover事件,鼠標(biāo)經(jīng)過時(shí)添加背景色
$("#btnTest").mouseover(function () {
oldColor = $("#btnTest").css("background-color");
$("#btnTest").css("background-color", "green");
});
//注冊(cè)ID為btnTest的按鈕的mouseout事件,鼠標(biāo)離開時(shí)還原背景色
$("#btnTest").mouseout(function () {
$("#btnTest").css("background-color", oldColor);
});
});
</script>
</head>
<body>
<div id="main">
<div id="div1" class="myDiv">我是div1
<div id="divSun">我是孫子div
<div id="divSunSun">我是孫子的孫子div</div>
</div>
<div id="divSun1">我是孫子div</div>
</div>
<div id="div2" class="myDiv">我是div2</div>
</div>
<div id="main1"></div>
<div id="main2"></div>
<input id="btnTest" type="button" value="測(cè)試按鈕" />
<div id="main3"></div>
</body>
</html>
希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。
相關(guān)文章
JQuery實(shí)現(xiàn)倒計(jì)時(shí)按鈕的實(shí)現(xiàn)代碼
頁面中需要實(shí)現(xiàn)某個(gè)按鈕點(diǎn)擊完后,禁用它,并顯示倒計(jì)時(shí)。這個(gè)默認(rèn)是3秒,代碼很簡(jiǎn)單2012-03-03
jQuery實(shí)現(xiàn)帶滾動(dòng)導(dǎo)航效果的全屏滾動(dòng)相冊(cè)實(shí)例
這篇文章主要介紹了jQuery實(shí)現(xiàn)帶滾動(dòng)導(dǎo)航效果的全屏滾動(dòng)相冊(cè),涉及jQuery針對(duì)頁面圖片元素與鼠標(biāo)事件的相關(guān)操作技巧,需要的朋友可以參考下2015-06-06
jQuery使用正則驗(yàn)證15/18身份證的方法示例
這篇文章主要介紹了jQuery使用正則驗(yàn)證15/18身份證的方法,涉及jQuery基于正則進(jìn)行數(shù)字字符串驗(yàn)證相關(guān)操作技巧,需要的朋友可以參考下2017-04-04
Bootstrap框架建立樹形菜單(Tree)的實(shí)例代碼
這篇文章主要介紹了在Bootstrap框架下怎么去建立一個(gè)樹形菜單,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),需要的朋友參考下吧2017-10-10
jQuery ajax仿Google自動(dòng)提示SearchSuggess功能示例
這篇文章主要介紹了jQuery ajax仿Google自動(dòng)提示SearchSuggess功能,結(jié)合實(shí)例形式較為詳細(xì)的分析了jQuery結(jié)合ajax與.net后臺(tái)調(diào)用sql數(shù)據(jù)庫實(shí)現(xiàn)搜索自動(dòng)提示相關(guān)操作技巧,需要的朋友可以參考下2019-03-03
jquery實(shí)現(xiàn)的一個(gè)導(dǎo)航滾動(dòng)效果具體代碼
首頁有一個(gè)導(dǎo)航頁面要實(shí)現(xiàn)滾動(dòng)效果,索性就仿造別人的效果自己做了一個(gè),大體上還行,看起來還是比較流暢的,現(xiàn)滾動(dòng)效果,腳本代碼如下,感興趣的朋友可以參考下2013-05-05
Jquery 基礎(chǔ)學(xué)習(xí)筆記之文檔處理
本節(jié)讓我們繼續(xù)Jquery知識(shí)的了解:文檔處理。文檔處理主要是對(duì)HTML元素進(jìn)行一些增操作,刪除操作,復(fù)制操作,替換操作。2009-05-05
初學(xué)Jquery插件制作 在SageCRM的查詢屏幕隱藏部分行的功能
SageCRM的查詢條件屏幕的條件比較多,會(huì)占用界面,用戶希望首先顯示常用的查詢條件,然后點(diǎn)擊展開的按鈕,可以看到一些不常用的查詢條件2011-12-12

