将表单元素(输入)转换为div

Question

有没有办法将所有输入字段转换为div？或跨度或任何东西.我有一个像这样的表:

<div id="calc">
<table>
<tr>
<td>Principal:</td>
<td><input value="100.00$" /></td>
</tr>
<tr>
<td>start date:</td>
<td><input value="02/02/2002" /></td>
</tr>
<tr>
<td>end date:</td>
<td><input value="02/02/2002" /></td>
</tr>
</table>
</div>

我想把这个源复制到没有输入的灯箱..像:

<table>
<tr>
<td>Principal:</td>
<td><div>100.00$</div></td>
</tr>
<tr>
<td>start date:</td>
<td><div>02/02/2002</div></td>
</tr>
<tr>
<td>end date:</td>
<td><div>02/02/2002</div></td>
</tr>
</table>

我想知道有没有办法将所有这些输入转换为div可能是通过使用.replace或其他东西？

谢谢

Answer 1

试试这个:

$('#calc').clone().appendTo('#lightbox');
$('#lightbox input').replaceWith(function() {
    return $('<div>' + $(this).val() + '</div>');
});

jsfiddle - http://jsfiddle.net/infernalbadger/c9Rub/2/

已更新,包括使用ID灯箱将内容复制到另一个div.