jQuery(八)繫結事件

2021-08-28 11:45:41 字數 2904 閱讀 1687

on()方法

說明:方法在被選元素及子元素上新增乙個或多個事件處理程式。

語法:$(selector).on(event,childselector,data,function)

event:必需。規定要從被選元素移除的乙個或多個事件或命名空間。由空格分隔多個事件值,也可以是陣列。必須是有效的事件。

childselector:可選。規定只能新增到指定的子元素上的事件處理程式,且不是選擇器本身。

data:可選。規定傳遞到函式的額外資料。

function:可選。規定當事件發生時執行的函式。

trigger:方法觸發被選元素的指定事件型別。

語法:$(selector).trigger(event,[param1,param2,…])

event:必需。規定指定元素要觸發的事件。

[param1,param2,…]:可選。傳遞到事件處理程式的額外引數。

insertafter():方法在被選元素後插入 html 元素。

如需在被選元素前插入 html 元素,請使用 insertbefore() 方法。

語法:$(content).insertafter(selector)

content:必需。規定要插入的內容(必須包含 html 標籤)。

selector:必需。規定在何處插入內容。

slidetoggle():方法在被選元素上進行 slideup() 和 slidedown() 之間的切換。

slideup()/slidedown():方法以滑動方式隱藏被選元素,向上/向下。

$(selector).slidetoggle(時間,速度,執行的函式)

off():方法通常用於移除通過 on() 方法新增的事件處理程式。

語法:$(selector).off(event,selector,function(eventobj),map)

event:必需。規定要從被選元素移除的乙個或多個事件或命名空間,由空格分隔多個事件值。

selector:可選。規定新增事件處理程式時最初傳遞給 on() 方法的選擇器。

function:可選。規定當事件發生時執行的函式。

map:規定事件對映 (),包含要新增到元素的乙個或多個事件,以及當事件發生時執行的函式。

/*

on()

1.1 單個事件

*/ $('div').eq(0).on('click',function())

$('div').eq(0).on('click',getname);

function getname()

/*1.2 指定的子元素上的事件處理程式,多個之間用逗號隔開

*/$('div').eq(1).on('click','span,p',function())

/* 1.3 多個事件

*/ $('div').eq(2).on('mouseover mouseout',function())

/* 1.4 事件對映 最後乙個不加逗號

*/ $('div').eq(3).on(,

mouseover:function());},

mouseout:function()

}) /*

1.5 自定義事件

*/ $('div').eq(4).click(function());

}) $('input').eq(0).on('addinput',function(a,b))

/* 1.6 傳遞引數

*/ $("div").eq(5).on("click", , getmessage);

function getmessage(e)

/*1.7 向元素後方新增內容

*/$("div").eq(6).on('click',function()

else

}) /*

1.8 移除事件

*/ $("div").eq(7).on('click',function())

$("div").eq(7).children().on('click',function())

bind()

說明:方法向被選元素新增乙個或多個事件處理程式,以及當事件發生時執行的函式。

語法:$(selector).bind(event,data,function,map)

event:必需。規定新增到元素的乙個或多個事件。由空格分隔多個事件值。

data:可選。規定傳遞到函式的額外資料。

function:必需。規定當事件發生時執行的函式。

map:規定事件對映 (),包含要新增到元素的乙個或多個事件,以及當事件發生時執行的函式。

/*

bind()

1.1 單個事件

*/$('div').eq(0).bind('click',function())

$('div').eq(0).bind('click',getname);

function getname()

/* 1.2 多個事件

*/$('div').eq(0).bind('mouseover mouseout',function())

$('div').eq(1).bind('click mouseout',function())

/* 1.3 事件對映 最後乙個不加逗號

*/$('div').eq(2).bind(,

mouseover:function());},

mouseout:function()

})/*

1.4 傳遞引數

*/$("div").eq(3).bind("click", , getmessage);

function getmessage(e)

jquery 事件繫結

1.bind bind 方法為被選元素新增乙個或多個事件處理程式,並規定事件發生時執行的函式。多個事件用空格分開 可以繫結的事件有click dblclick mouseover mouseout mousedown mouseup等滑鼠事件,至於鍵盤事件,嘗試沒發現效果。selector bind...

jquery繫結事件

1.bind 向匹配元素新增乙個或多個事件處理器。使用方式 selector bind event,data,function event 必需項 新增到元素的乙個或多個事件,例如 click,dblclick等 單事件處理 例如 selector bind click data,function ...

jQuery事件繫結

區別 bind 是直接繫結在元素上 live 則是通過冒泡的方式來繫結到元素上的。更適合列表型別的,繫結到document dom節點上。和.bind 的優勢是支援動態資料。delegate 則是更精確的小範圍使用事件 效能優於.live on 則是最新的1.9版本整合了之前的三種方式的新事件繫結機...