動態生成的html添加事件


一、問題描述

  用jQuery的append()方法動態添加了一段html代碼之后,發現在為新添加的元素綁定click事件時無法獲取該新元素。

二、解決方法

  度娘推薦的方法基本是用live()方法

  live()的官方定義和用法:

  live() 方法為被選元素附加一個或多個事件處理程序,並規定當這些事件發生時運行的函數。通過 live() 方法附加的事件處理程序適用於匹配選擇器的當前及未來的元素(比如由腳本創建的新元素)。

  live()的詳細使用方法可以查看jQuery live()

  live()和bind()的區別就是live不僅可以給頁面中現有的元素綁定事件,還可以給將來動態添加進來的元素綁定時間。

  於是我用live()替換了bind(),但報出了新錯誤:TypeError: $(...).live is not a function

  經過查詢以后發現,原來是jQuery 1.9及其以上已經無法使用live(),可以用on()方法代替live().

  on()的官方定義和用法:

  on() 方法在被選元素及子元素上添加一個或多個事件處理程序。自 jQuery 版本 1.7 起,on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。

  注意:使用 on() 方法添加的事件處理程序適用於當前及未來的元素(比如由腳本創建的新元素)。

   on()的詳細使用方法可以查看jQuery on();

  總之,記住如果你要綁定動態生成的元素事件,一定要先找到他的父元素(父元素不能是動態生成的,否則繼續往上找),在父元素中綁定,然后再進行過濾就ok了,對了,我測試了hover事件發現不行,沒去深究原因。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM