0

我正在制作一个动态加载到内容区域的表单。单击链接时，jQuery 应复制该表单的一部分，以添加更多参与者。麻烦的是，它不会响应。我在这里和谷歌上搜索过，但由于某种原因，那里给出的答案不起作用。

这是html（或至少是重要的部分）：

<div id="container">
    <div id="main">
        <div id="content">
            <div> 
                <h1>Hello, I am a form!</h1>
                <form id="contactform">
                    <p class="respondent">
                        <input type="text" value "first name" />
                        <input type="text" value="last name" />
                    </p>
                    <span id="addRespondent">add respondent</span>
                </form>
            </div>
        </div>
    </div>
</div>

表单通过 .load() 函数从外部 html 文件动态加载到包含在“内容”div 中的 div 中。它替换了该 div 中先前存在的其他内容。

我用 jQuery 尝试过这样的事情：

$(document).ready(function (e){
    $('#main').on('click','#addRespondent', function(e) {
        $('p.respondent').clone().prependTo('#addRespondent');
        e.preventDefault();
    });
});

这不是错误使用 .clone() 或 .prependTo() 函数的问题，即使我在函数中添加了一个简单的警报，也没有任何反应。我试过摆弄查找和过滤，但没有结果。如果有人指出我做错了什么，我将不胜感激。

4

1 回答 1

0

我在您的代码中看到的唯一问题是

$('p.respondent').clone().prependTo('#addRespondent');

（将每个添加p.respondent到的开头#addRespondent），您可能想要

$('p.respondent:first').clone().insertBefore('#addRespondent');

p.respondent（在之前添加第一个#addRespondent）。也许您也想清理表格？

$('p.respondent:first')
  .clone().insertBefore('#addRespondent')
  .find("input").val("");

另外，是否有机会#main在准备好的文件中不存在？如果是这样，而不是

$('#main').on('click', ...

你应该委托给其他一些元素：

$(document).on('click', ...
于 2013-01-18T11:02:30.000 回答