jQuery(七)常用事件
1、當單擊元素時,發生 click 事件
$('div').eq(0).click(function()
{
$(this).css('color', 'red');
})
2、當元素的值改變時發生 change 事件(僅適用於表單欄位)。
$('input[name=userName]').change(function(){
$(this).css('background', 'red');
})
3、當滑鼠指標離開被選元素時,會發生 mouseover 事件。
4、當滑鼠指標離開被選元素時,會發生 mouseout 事件。
$('div').eq(1).mouseover(function() { $(this).css('color', 'red'); }) $('div').eq(1).mouseout(function() { $(this).css('color', 'blue'); })
5、hover() 方法規定當滑鼠指標懸停在被選元素上時要執行的兩個函式。
$('div').eq(2).hover(function()
{
$(this).css('color', 'red');
},
function()
{
$(this).css('color', 'blue');
})
6、focus() 當元素獲得焦點時(當通過滑鼠點選選中元素或通過 tab 鍵定位到元素時),發生 focus 事件。
if($('#passWord').val() == '')
{
$('#passWord').focus();
}
7、當鍵盤鍵被按下時發生 keydown 事件。
8、當鍵盤鍵被鬆開時發生 keyup 事件。
使用 event.which 屬性來返回哪個鍵盤鍵被按下
$('#email').keydown(function(){
$(this).css('color', 'pink');
})
$('#email').keyup(function(){
$(this).css('color', 'green');
})
$(document).keydown(function(){
//alert(event.which);
})
9、顯示show() 隱藏hide()
$('#show').click(function() { $('div').eq(3).show(); }) $('#hide').click(function() { $('div').eq(3).hide(); })
10,淡入淡出效果
fadeIn() 用於淡入已隱藏的元素。
fadeOut() 方法用於淡出可見元素。
fadeToggle() 如果淡出,則淡入,如果淡入,則淡出。
fadeTo() 方法允許漸變為給定的不透明度(值介於 0 與 1 之間)
$('#fadeIn').click(function()
{
$('div').eq(4).fadeIn(5000);
})
$('#fadeOut').click(function()
{
$('div').eq(5).fadeOut(5000);
})
$('#fadeToggle').click(function()
{
$('div').eq(6).fadeToggle(5000);
/* 設定透明度
$('div').eq(6).fadeTo(3000,0.4);
*/
})
11滑動效果
slideDown():方法用於向下滑動元素。
slideUp():方法用於向上滑動元素。
slideToggle():可以在 slideDown() 與 slideUp() 方法之間進行切換。
function navJump(leif){
if(leif=='userManage'){
$('.column').eq(0).slideToggle('fast');
}
}
相關推薦
jQuery(七)常用事件
1、當單擊元素時,發生 click 事件 $('div').eq(0).click(function() { $(this).css('color', 'red'); }) 2、當元素的值改變時發生 change 事件(僅適用於表單欄位)。 $('i
從零開始學 Web 之 jQuery(七)事件冒泡,事件參數對象,鏈式編程原理
eval uri turn 定位 return 也會 否則 ont sele 大家好,這裏是「 從零開始學 Web 系列教程 」,並在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公眾號:Web前端之巔 博客
從零開始學 Web 之 jQuery(七)事件冒泡,事件引數物件,鏈式程式設計原理
一、事件冒泡與阻止事件冒泡 事件冒泡:當一個元素觸發某個事件的時候,會把這個事件傳播到其父元素,一直到頂層元素。 阻止事件冒泡:在被觸發事件的子元素中新增 return false; 即可。 二、事件的觸發 之前講的繫結事件是事件觸發後的事件處理過程,並且上面的事件觸發是被動的事件觸發,怎麼可以主動觸發事
jquery(3)--常用方法
標簽 效果 oct script 節點 orange 下標 log range $()下的常用方法: 1、has(); 2、not(); 3、filter(); 4、next(); 5、prev(); 6、find(); 7、eq(); 8、index(); 9、attr(
Android 開發:(七)常用佈局屬性詳解
第一類:屬性值為true或false android:layout_centerHrizontal 水平居中 android:layout_centerVertical 垂直居中 android:layout_centerInparent 相對於父元素完全居中 androi
C/C++:各種基本演算法實現小結(七)—— 常用演算法
各種基本演算法實現小結(七)—— 常用演算法 (均已測試通過) ====================================================================== 1、判斷素數 測試環境:VC 6.0
TensorFlow 學習(七) — 常用函式 api、tf.nn、tf.keras
0. 四則運算 平方:tf.square(),開方:tf.sqrt() tf.add()、tf.sub()、tf.mul()、tf.div()、tf.mod()、tf.abs()、tf.neg()
VB.net學習筆記(七)物件事件的定製
物件還有一個重要的特性:事件 根據需要呼叫指定的功能,與物件互動作用。即:在執行過程中某動作發生後,給物件提供通知。 物件引發自己的事件,通過這個機制通知客戶端程式碼執行了重要的操作或事件。 VB.net中,可用Net委託機制提供事件支援。 1、事件處理 Pr
Docker小技巧(七)——常用命令
local 本機映象 docker images 檢視容器 執行中 docker container ls docker ps 所有 docker container ls -a docker ps -a 終止容器 d
【朝花夕拾】Android自定義View篇之(七)Android事件分發機制(下)解決滑動衝突
前言 前面兩篇文章,花了很大篇幅講解了Android的事件分發機制的原理性知識。然而,“紙上得來終覺淺,絕知此事要躬行”,前面講的那些原理,也都是為解決實際問題而服務的。本文將結合實際工作中經常遇到的滑動衝突案例,總結滑動衝突的場
【朝花夕拾】Android自定義View篇之(七)Android事件分發機制(下)滑動衝突解決方案總結
前言 轉載請宣告,轉自【https://www.cnblogs.com/andy-songwei/p/11072989.html】,謝謝! 前面兩篇文章,花了很大篇幅講解了Android的事件分發機制的
selenium測試(Java)-- 鍵盤事件(七)
剪切 ted toolbar www. lee 內容 title bsp logs 1 package com.test.key; 2 3 import org.openqa.selenium.By; 4 import org.openqa.selenium.
windows多線程(七) 事件event
繼承性 image pre 說明 無法 cal urn dac window 前面說的互斥量Mutex與關鍵段CriticalSection都不能實現線程的同步,只能實現互斥,接下來我們用時間event就可以實現線程的同步了,事件也是一個內核對象。 一、相關函數說明 (一)
從零開始學 Web 之 jQuery(六)為元素綁定多個相同事件,解綁事件
png 好用 添加 方式 執行 存在 區別 也會 地址 大家好,這裏是「 從零開始學 Web 系列教程 」,並在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公眾號:Web前端之巔 博客園:http://ww
從零開始學 Web 之 移動Web(五)touch事件的缺陷,移動端常用插件
bar 知識 怎麽 element clas mas index ont 彈性 大家好,這裏是「 從零開始學 Web 系列教程 」,並在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公眾號:Web前端之巔 博
jQuery(2)動畫和事件
基本動畫 元素.show([speed],[callback]) 元素.hide([speed],[callback]) 元素.toggle([speed],[callback]) 元素.slideDown([speed],[callback]) 元素.slideUp([speed],[callba
Linux常用終端命令及擴充套件(七)
1.通過apt安裝、解除安裝軟體 安裝軟體:sudo apt install 軟體包 解除安裝軟體:sudo apt remove 軟體名 更新已安裝的包: sudo apt upgrade2.Ubuntu配置軟體源:Ubuntu中有一個主伺服器,所有的軟體安裝包都儲存在裡
jquery(一)jQuery事件
W3School jquery事件 方法 描述 bind() 向匹配元素附加一個或更多事件處理器 blur() 觸發、或將函式繫結到指定元素的 blur 事件
(七)Linux學習筆記-Linux常用命令-Shell常用技巧
(七)Linux學習筆記-Linux常用命令-Shell常用技巧 Shell常用技巧 < > >>輸入輸出重定向 |(管道) ; && ||(命令連線符) ''(命令替換符) ali
jQuery(八)繫結事件
on()方法 說明:方法在被選元素及子元素上新增一個或多個事件處理程式。 語法:$(selector).on(event,childSelector,data,function) event:必需。規定要從被選元素移除的一個或多個事件或名稱空間。由空格分隔多個事