#8642 closed bug (invalid)
$(':input').text('something') throw error in IE
Reported by: | laubstein | Owned by: | |
---|---|---|---|
Priority: | undecided | Milestone: | 1.next |
Component: | unfiled | Version: | 1.5.1 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
I know, .text() does not change the value of inputs (.val() do that), but just IE throw an exception.
Change History (8)
comment:1 Changed 12 years ago by
Resolution: | → invalid |
---|---|
Status: | new → closed |
comment:2 Changed 12 years ago by
Yes, I know that, but the point is: when I make the tests using IE, I have an exception within the jQuery (line 5114).
I can think in two solutions:
- More generic (.append method)
- FROM
/* 5113 */ if ( this.nodeType === 1 ) { /* 5114 */ this.appendChild( elem ); /* 5115 */ }
- TO
/* 5113 */ if ( this.nodeType === 1 && this.nodeName !== 'INPUT' ) { /* 5114 */ this.appendChild( elem ); /* 5115 */ }
- OR
/* 5113 */ if ( this.nodeType === 1 ) { /* 5114 */ try { /* 5115 */ this.appendChild( elem ); /* 5116 */ } catch (e) {} /* 5117 */ }
- FROM
- More specific (.text method)
- FROM
/* 5042 */ return this.empty().append( (this[0] && this[0].ownerDocument || document).createTextNode( text ) );
- TO
/* 5042 */ return this.empty().each(function() { /* 5043 */ $(this).not(":input").append( (this[0] && this[0].ownerDocument || document).createTextNode( text ) ); /* 5044 */ });
- FROM
Both solutions works... but using the "more specific" solution we can have the same DOM tree on IE, FF, Chrome, etc.
comment:3 follow-up: 4 Changed 12 years ago by
I do not understand the "same DOM tree" comment. It is incorrect to attempt to append DOM elements to an input. A DOM tree with child elements on an input is an invalid document. I don't think we need to add checks for that.
comment:4 Changed 12 years ago by
When I wrote "same DOM tree", I was trying to say that:
- Using FF, Chrome and Opera:
- The code
$('#myInput').text('something');
- Produces
<input type="text" id="myInput">something</input>
- The code
- Using IE:
- The code
$('#myInput').text('something');
- "Produces" (throw error and don't change the input)
<input type="text" id="myInput" />
- The code
I have updated the fiddle: http://jsfiddle.net/laubstein/mRZ5Z/1/
Thanks
comment:5 follow-up: 6 Changed 12 years ago by
I can't really blame IE for throwing an error, rather than producing an invalid document. IE is trying to send a message here ... listen to it: <input>
elements cannot have children.
comment:6 Changed 12 years ago by
Dave,
did you read that the exception has occurred inside the jQuery file (line 5114 called from 5042)?
This problem came to me because a co-worker tried to do something like that:
// "left" is a generic css class (text-align: left) $('.left').text('');
We have already fixed using:
$('.left').not(':input').text(''); $(':input.left').val('');
Just for curiosity... I looked in jQuery 1.5.1 source code and have found 3 "try..catches" that just prevent's IE from throwing an error:
- lines 2474 and 2498 - prevent IE from throwing an error for some elements with some event types, see #3533
- line 5802 - Wrapped to prevent IE from throwing errors when 'invalid' values are provided, Fixes bug #5509
- line 6094 - #8138, IE may throw an exception when accessing a field from document.location if document.domain has been set. (extra, because the catch block has some code)
Yes, I know that <input> (and some others) elements cannot have children =). (http://www.w3.org/TR/html4/index/elements.html and http://dev.w3.org/html5/spec/Overview.html)
Thank you!
comment:8 Changed 10 years ago by
That's because you're not supposed to do that. Use .val()
instead.
Yes, because you are trying to add a text node to an input and inputs cannot have child elements.