Side navigation
#3552 closed bug (fixed)
Opened October 29, 2008 11:42PM UTC
Closed January 11, 2010 09:31PM UTC
.wrapInner() won't work on empty elements
Reported by: | dtetto | Owned by: | flesler |
---|---|---|---|
Priority: | minor | Milestone: | 1.4 |
Component: | core | Version: | 1.4a2 |
Keywords: | wrapInner | Cc: | |
Blocked by: | Blocking: |
Description
$(elem).wrapInner('<div/>') does nothing if the original element is empty.
There ''is'' some logical elbow-room here -- one could argue that the wrap shouldn't be performed if there's nothing to wrap -- but the current behavior feels like a bug to me.
Based on the syntax, the transformation is being performed on the original element, not on its children:
$(elem).wrapInner('<div/>'); // wrap the inside of this element with a div
vs.
$(elem).contents().wrapAll('<div/>'); // wrap this elements contents (if any) with a div
It's easy to get around this:
$.fn._wrapInner = $.fn.wrapInner;
$.fn.wrapInner = function(wrapper){
if(this.contents().length) return this._wrapInner(wrapper);
else return this.append(wrapper);
}
But I'd argue it ought to be changed in the library itself unless there's reason to believe a lot of folks are relying on the current behavior.
Attachments (3)
Change History (5)
Changed March 04, 2009 08:14AM UTC by comment:1
Changed March 04, 2009 09:16AM UTC by comment:2
And here's a "patch" (a diff actually) that fixes the problem. I hope it's ok style wise...
Changed March 05, 2009 12:49AM UTC by comment:3
Added an alternative patch with a simpler/faster check for .firstChild and append instead of html (faster). Hope it's useful.
Changed October 14, 2009 12:26AM UTC by comment:4
component: | unfilled → core |
---|
Changed January 11, 2010 09:31PM UTC by comment:5
milestone: | 1.3 → 1.4 |
---|---|
resolution: | → fixed |
status: | new → closed |
version: | 1.2.6 → 1.4a2 |
IMO wrapInner should behave consistently whether there are actual nodes to enclose or not.
I'm attaching a simple testcase (uses http://code.jquery.com/nightlies/jquery-nightly.js).