使用jQuery复制“默认”表单

时间：2015-09-28 作者：N00b

我有以下代码：

// Add form
jQuery(\'.add-form\').click(function() {
    // "Copy" default form
    formGroup = jQuery(\'.form-item\').html();
    // "Paste" default form
    jQuery(\'#main-form\').append(\'<div class="form-item row">\'+formGroup+\'</div>\');

});

Situation:

  • 默认情况下有一个表单
  • 如果按下按钮，此代码将运行
  • 它复制默认表单；将其置于默认窗体下，如果再次按下，将生成第三个窗体（&L）；将其置于第二个等下

    Problem:

    我需要以某种方式存储默认表单以进行编码-问题是我需要新表单具有空字段&；使用原始DOM（填写字段时可能会更改）。

    Question:

    如何将默认表单存储在代码中（隐藏或其他），以便始终加载默认表单？

    还是有更好的方法？

1 个回复
最合适的回答,由SO网友:Omar Tariq 整理而成

我不知道你的html代码，但下面是它的工作方式。这样做的目的是将原始文件隐藏在其他地方。

HTML

<button class="add-form">add form</button>
<form id="main-form">
    <div class="form-item row">
      <input type="text" name="abc">
    </div>
</form>
<div class="stay-hidden original-form-item">
  <input type="text" name="abc">
</div>
CSS

.stay-hidden {
    display:none;
}
JS公司

// Add form
jQuery(\'.add-form\').click(function() {
    // "Copy" default form
    formGroup = jQuery(\'.original-form-item\').clone();
    // "Paste" default form
    jQuery(\'#main-form\').append(\'<div class="form-item row">\'+ formGroup.html() +\'</div>\');

});
JSFIDLE（JSIDLE）：

http://jsfiddle.net/u5Lomazx/1/

标签： jquery   forms   小码农  

相关推荐

jQuery .html rendering

我试图在jQuery中呈现HTML，但它不起作用。我的PHP文件：if ( $lastTokens[0][\'token\'] < $lastTokens[1][\'token\']) { $prixachat_format = \'<i class=\"fas fa-arrow-up\"></i>\'.number_format($prixachat, 0, \',\', \' \'); } elseif ($lastTokens[0][\'tok