javascript - 选择已填充数据的表单元素

Question

问题很简单。

我使用.html()来获取div的html代码。 div 包含由用户填充的表单元素。

.html() 只返回html代码，不保留填充的文本。

有没有办法轻松保留/复制 html 元素中的文本？

PS。我已经知道了

.val()

将返回值，但我需要

html code + all values

为了将表单复制/粘贴到其他地方。

Answer 1

按照@Madness的建议，您可以使用 .clone() 获取 html 以及值。

唯一的问题是 select 值不会被克隆(似乎是 jquery 中的一个已知错误。请参阅此票证以获取更多信息 http://bugs.jquery.com/ticket/1294 )。所以我添加了一个解决方法来解决这个问题。我所做的是在像这样克隆之前获取变量中的所有选择值

var selects = $('#myDiv:first').find("select");

这里myDiv是div的id

最终的jquery代码如下所示

$(function() {
    $('button').on('click', function() {
        var selects = $('#myDiv:first').find("select");
        var html = $('#myDiv:first').clone(true);


        $(selects).each(function(i) {
            console.log($(this).val());
            var select = this;
            $(html).find("select").eq(i).val($(select).val());
        });
        $('#htmlWithVal').html(html);
    });
});

这是一个工作 JSFIDDLE 相同。希望这有帮助。