How to preserve a child element's bind functions in jQuery/javascript
I have some tags that I want to bind to a function within jQuery's datepicker. However, jQuery automatically binds another function to the parent (.ui-datepicker-inline
) div's mouseover
and mouseout
events.
I want to override this function in some cases, but when some other event occurs, revert back to default functioning. I tried binding mouseover
to it's parent div (hasDatepicker
) and this worked fine. However when I unbind the parent, the child's old bind function stops working as well. Why is this? Is there any way to avoid that? I don't care if the child keeps it's bind function, as long as the parent's bind does it's thing afterward. I also don't want to lose the child functionality when I unbind the parent.
I have a jQuery element datePicker
which is the element that has the original bind (.ui-datepicker-inline
) as far as I can tell from the jQuery UI code.
// This binds my function, occurring after datePicker's bound function,
// and works fine.
datePicker.parent().bind('mouseover', hoverWeek) // hoverWeek is a function(event)
/* ... */
// This unbind's datePicker as well as datePicker.parent()
datePicker.parent().unbind('mouseover');
Can I save the bound function and put it back when I need it? I shouldn't think I'd have to, but if I did, how would I even go about doing that? Can I just say datePicker.bind('mouseover')
to get the function bound to it?
开发者_运维百科[Update] There were a few issues: Mainly I had some conflicting code, but there were also some issues with the bubbling effect. The solutions listed below are both good, and for future reference, here is another solution that works: http://jsfiddle.net/redEvo/7QpDx/
You can pass just your function to the unbind call:
datePicker.parent().unbind('mouseover', hoverWeek);
I'm not really sure how much else I can do without more of the code. It seems to work in this fiddle for me. I even implemented a hoverWeek()
although you may be doing more than in my version.
I am using .unbind()
in a slightly different way using namespaced events:
datePicker.bind('mouseover.myEvent', hoverWeek);
精彩评论