jQuery .html() does not copy contents of textareas or inputs
I'm trying to copy the contents of an element using elem.html()
but it's not including the contents of inputs
or textareas
.
Here's an example (try writting in the boxes then click "Copy"): http://jsfiddle.net/gAMmr/2/
Is there a way of copying all info?
These are the approaches I have tried so far:
elem.clone()
- not suitable for my task because it 开发者_开发问答copies the element itselfelem.children().clone()
- misses out text nodeselem.contents().clone()
- doesn't include the textarea contents
EDIT: The results seem to be different in each browser. I'm using Chrome.
$("button").click(function () {
$("#2").html($("#1").html());
$("#1").find("input").each(function(idx) {
$("#2").find("input").eq(idx).val($(this).val());
});
$("#1").find("textarea").each(function(idx) {
$("#2").find("textarea").eq(idx).val($(this).val());
});
});
http://jsfiddle.net/gAMmr/5/
As Šime Vidas
pointed out earlier, this is a 4-year old bug which hasn't been corrected, though a fix exists which is quite simple to apply:
-Download jquery.fix.clone.js
-Include it in your page: <script src='path/to/jquery.fix.clone.js'></script>
From then on cloned textarea
elements should include the text of their source (note: you need to use the .clone()
method to create your new textarea
, not .html()
).
Inputs don't contain HTML, they have values
. Use .val()
for form elements.
How about checking the type of the element you're trying to grab the inner text from and if it's an input
or textarea
use $.text()
instead of $.html()
精彩评论