Jquery 将表单输入存储在重写为 doc 的变量中，它们具有原始值

Question

我正在使用 jQuery 为印刷店构建模板表单。用户可以填写表格并单击“预览”按钮。此时，我将表单存储在变量中，并使用 ReplaceWith() 重写文本输入，以将输入从表格单元格中交换出来，并将其替换为其值。 此时，我会显示一个“编辑更多”按钮，以防他们想重新考虑他们的输入。 所以，...然后我将存储变量中的 html 写回到表单中，但令人惊讶的是，文本输入值是用户输入之前的原始默认值。 这是一个相当复杂的项目。我讨厌发布代码，因为我觉得这只会使讨论变得复杂。我希望有人已经有过这种经历，所以知道发生了什么！ :-) 谢谢大家。

Answer 1

如果我正确理解您的要求，我会使用 jQuery 的 .detach() 重写您的一些代码 方法。它允许您将通常要删除的元素存储到变量中，以便稍后可以将它们重新插入回 DOM 中。

您仍然可以像常规 jQuery 对象一样与分离的元素进行交互，但您不会在页面上看到它们。

这是一个示例：

<script>
$(function(){

    var detachedInput = '';
    var detachedBtn = '';

    $('#preview').click(function(){
        // store elements for later use
        detachedInput = $('#input').detach();
        detachedBtn = $(this).detach();

        // whatever you're trying to do with the output
        //...this is just an example, and not a very good one at that
        $('body').html($(detachedInput).val());
        $('<button>Edit</button>').appendTo('body')
            .click(function(){
                $('body').empty()
                    .append(detachedInput)
                    .append(detachedBtn);
            });
    });

});
</script>

<input id='input' />
<button id='preview'>Preview</button>

作为旁注，发布一些代码通常会有所帮助，因为它可以让每个人更好地了解您要做什么。