You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
jquery.initialize plugin is created to help maintaining dynamically created elementes on page.
5
+
jQuery.initialize plugin is created to help maintain dynamically created elements on the
6
+
page.
6
7
7
-
It has exacly the same syntax like jQuery $elem.each function.
8
+
## Synopsis
8
9
9
-
The difference is that jQuery elem .each function is called only once on elements that already exists on page right now.
10
+
jQuery.initialize will iterate over each element that matches the selector and apply the
11
+
callback function. It will then listen for any changes to the Document Object Model (DOM)
12
+
and apply the callback function to any new elements inserted into to the document that
13
+
match the original selector.
10
14
11
-
.initialize function will do what .each function does and then it will call function again on new items matching selector automatically just when they will be created by ajax or pretty much anything you can imagine to add new elements to page.
TODO: make it `bower` and `npm` compatible, add advanced performance test.
18
-
19
-
# Example of use
20
-
21
-
**Initialize has exactly the same syntax as with the .each function**
23
+
## Example of use
22
24
23
-
$(".some-element").initialize( function(){
25
+
$.initialize(".some-element", function(){
24
26
$(this).css("color", "blue");
25
27
});
26
28
27
-
But now if new element matching .some-element selector will appear on page, it will be instantly initialized. The way new item is added is not important, you dont need to care about any callbacks etc.
29
+
But now if new element matching .some-element selector will appear on page, it will be instantly initialized. The way new item is added is not important, you dont need to care about any callbacks etc.
28
30
29
-
$("<div/>").addClass('some-element').appendTo("body"); //new element will have blue color!
30
-
31
+
$("<div/>").addClass("some-element").appendTo("body"); //new element will have blue color!
31
32
32
-
Note that plugin needs to know the selector of items you want to initialize. Thats why you need to **call initialize right after you've created jQuery element from selector.**
33
-
34
-
$(".some-element").initialize(myFunc); //will work
35
-
$(".some-element").children().initialize(myFunc); //will NOT work
36
-
37
-
38
-
39
-
**Support**
33
+
## Browser Compatibility
40
34
41
35
Plugin is based on **MutationObserver**. It will works on IE9+ (**read note below**) and every modern browser.
42
36
@@ -45,7 +39,12 @@ Note: To make it work on IE9 and IE10 you'll need to add MutationObserver polyfi
45
39
-----------------
46
40
[Performance test](https://jsfiddle.net/x8vtfxtb/5/) (thanks to **@dbezborodovrp** and **@liuhongbo**)
47
41
48
-
# Contributors
42
+
## Todo
43
+
44
+
- make it `bower` and `npm` compatible, add advanced performance test.
0 commit comments