How do I keep jQuery event handlers after being applied to an element .wrap ()?
Wrote a jQuery module yesterday to reuse on all projects.
The module creates modal windows.
The principle of operation is simple - the selected block is wrapped in a .Popup wrapper using the jQuery "wrap" method.
Everything works, everything is cool
Wrapped a form with margins and a button.
There are blur and change handlers on the margin
The button has a click and preventDefault handler
When you click on the button in the open modal window, the page reloads.
Subtracted somewhere that the wrap function creates a clone of the selected element and all handlers fly off.
ok but the field blur handlers are working.
Climbed into jquery, found the wrap method
It uses the jQuery clone method internally. You can pass a parameter to the clone method, which is responsible for copying handlers and all properties.
By default, there was something incomprehensible, set it true
Not working !!!
I went to the mozilla browser, it displays handlers that hang on elements in devtools.
My only handler hangs on the button.
if you don't call the form with my plugin, the button works
Combine and transfer all handlers to the top level on the body and, depending on what is inside event.target, run this or that script.
You can also not so radically, just put the handlers in the appropriate attributes of the elements.
If neither one nor the other option is suitable, then try to write a function for wrapping yourself with the parameters that are needed.Ruby Livingston
To place the code, please use CodePen or similar tool. Thanks you!