Jquery動態新增的元素繫結事件的3種方法

2022-07-25 11:18:13 字數 1241 閱讀 7957

假設我們點選li標籤,彈出他的文字,如果是動態新增的li,點選是沒有效果的,壓根彈不出來文字。

下面博主分享一下為動態新增的元素繫結事件的三種方法,網上一般都是兩種,我在這裡多增加了一種。

事件案例:

<

ul id

="ul1"

>

<

li><

a href

="">世界上第三種電梯誕生了,居然是中國人發明的!

a>

li>

<

li><

a href

="">電視名人辱罵河南人被訴 美媒:河南人常遭歧視 [評]

a>

li>

<

li><

a href

=""a

>

li>

ul>

<

a id

="a1"

href

="">新增一條

a>

第一種方法:給新增的元素新增onclick事件,最簡單的方法

那麼,新增的li標籤應該是這樣:

第二種:用on()方法,給它的父級、祖先元素繫結事件 

**: 繫結到父級元素

$("#ul1").on("click", "li", function

())

或者 繫結到祖先元素document

$(document).on("click", "#ul1 li", function

())

第三種:元素新增的時繫結事件

$("#a1").click(function

()) $("#ul1").prepend(li);

return

false

;});

變數li是乙個jquery物件,直接給它繫結事件,在插入到dom中,這種也是可以的。

你說我想點選li裡面的a標籤,給它繫結事件怎麼做呢?

也很簡單,更平常時一樣操作

**如下:

li.find("a").click(function

())

好了,本教程寫完了。(*^__^*) 

jQuery動態新增的元素繫結事件

今天在做專案是時候發現動態新增的元素不能繫結事件,由於本人js和jquery技術有限,所以也不知道原因,一查才知道,動態新增的元素繫結事件就會失效,所以修改了一下。jquery中繫結事件一般使用bind,或者click,但是這只能是對已經載入好的元素定義事件,那些後來新增插入的元素則需要另行繫結。在...

jquery給動態新增的元素繫結事件

jquery給動態新增的元素繫結事件的方法 jquery中繫結事件一般使用bind,或者click,但是這只能是對已經載入好的元素定義事件,那些後來新增插入的元素則需要另行繫結。在1.7版本以前使用live。但是在1.8版本以後推薦使用on。需要給jquery 1.7版以前使用live動態繫結事件 ...

Jquery 為動態新增元素繫結事件

有一段時間沒用jquery了,今天又碰到這個問題。當時是知道有livejquery可以解決。但是我並不喜歡為了這個而另外載入乙個。我當時的處理方法是在新增的時候手工繫結事件處理函式。不過新版的jquery已經新增了這個功能。我們已經不需要為此煩惱了。參考 以前我們定義事件,比如為元素定義單擊事件是這...