首頁 > 其他

js 初始化動態建立on方法

2019-12-12 19:43:43

在做前端頁面開發時,如果你有的元素是通過js建立的,但又需要為新建立的html元素新增事件,我們可以在初始化時動態建立on方法,這樣就不需要每次新建元素都系結事件了,下面來看一下是怎麼處理的。

1

我們在html裡先建立一個div元素,有class樣式屬性。


2

然後在jquery的ready方法裡,為這個div新增點選事件,就是使用on方法來新增,點選事件裡彈出div裡的內容。


3

新增事件後,在程式碼後面定義一個字串,是新加div的html程式碼字串。


4

把字串通過append方法附加到c1這個父div上,就是在這個div上新加了二個div。


5

新增div後,我們不需要再為這二個div新增事件,因為之前已經使用on來為click樣式的div新增好事件了。

執行頁面,點選第一個div,這個div不是通過js建立的。


6

點選後,能正常彈出div的內容,事件正常。


7

點選第二個div,這個div是用js動態新增的。

也能彈出該div的內容,事件也正常。



IT145.com E-mail:sddin#qq.com