使用jQuery动态添加HTML表单字段 因为我不能使用div内部表单，我想知道如何在窗体中间添加新字段（并且我不能在这里使用 .AppEnter） >而不重载页面或重写表单？（使用jQuery）

编辑： 这是HTML：

<form id="form-0" name="0">
<b>what is bla?</b><br>
<input type="radio" name="answerN" value="0"> aaa <br>
<input type="radio" name="answerN" value="1"> bbb <br>
<input type="radio" name="answerN" value="2"> ccc <br>
<input type="radio" name="answerN" value="3"> ddd <br>
//This is where I want to dynamically add the new radio or text line

<input type="submit" value="Submit your answer">
//but HERE is where .append() will put it!

</form>

什么是bla？

aaa

bbb

ccc

ddd

//这就是我想要动态添加新的广播或文本行的地方
//但是这里是.append（）将放置它的位置！

您可以使用

append

和

appendTo

等方法添加任何类型的HTML（其中包括）：

例如：

$('form#someform').append('<input type="text" name="something" id="something" />');

$（'form#someform'）。追加（“”）；

类似的方法可能会奏效：

<script type="text/javascript">
$(document).ready(function(){
    var $input = $("<input name='myField' type='text'>");
    $('#section2').append($input);
});
</script>

<form>
    <div id="section1"><!-- some controls--></div>
    <div id="section2"><!-- for dynamic controls--></div>
</form>

$（文档）.ready（函数（）{
变量$input=$（“”）；
$（'#section2'）。追加（$input）；
});

这将在id为“password”的输入字段后插入新元素

$（文档）.ready（函数（）{
var newInput=$（“”）；
$（'input#password'）。在（newInput）之后；
});

---

不确定这是否回答了您的问题。

这条线索令人困惑的地方在于：

$('.selector').append("<input type='text'/>"); 

$（'.selector'）。追加（“”）；

它将目标元素作为.selector的子元素追加

及

$（“”）.appendTo（'.selector'）；

它将目标元素作为.selector的子元素追加

注意当使用不同的方法时，目标元素和.selector的位置是如何变化的

您要做的是：

$(function() {

  // append input control at start of form
  $("<input type='text' value='' />")
     .attr("id", "myfieldid")
     .attr("name", "myfieldid")
     .prependTo("#form-0");

  // OR

  // append input control at end of form
  $("<input type='text' value='' />")
     .attr("id", "myfieldid")
     .attr("name", "myfieldid")
     .appendTo("#form-0");

  // OR

  // see .after() or .before() in the api.jquery.com library

});

$（函数（）{
//在表单开头追加输入控件
$("")
.attr（“id”、“myfieldid”）
.attr（“名称”、“myfieldid”）
.prependTo（“表格-0”）；
//或
//在表单末尾追加输入控件
$("")
.attr（“id”、“myfieldid”）
.attr（“名称”、“myfieldid”）
.附于（“#表格-0”）；
//或
//请参见api.jquery.com库中的.after（）或.before（）
});

在Chrome中，似乎有一个appendTo错误，它使用了一个附加到表单的框架集ID。

---

直接用div替换掉属性类型，它就工作了。

你的问题没有太多意义。你已经试过什么了？我试着在表单的最后一个子元素之前选择一个，然后使用append，但它不起作用。什么让你认为你不能在

form

元素中使用

div

元素？@Rob，@pixelbuby，tahnx但问题是如果你有一个完整的表单，我不能使用AppEnter，因为它会在标签下面插入行，所以它不会是表单的一部分，我怎么才能在表单的中间插入$输入？@ ILYAD-AppEnter将新元素插入到标签中，在这种情况下，它将把新的输入放入表单标签中。@ Lyad，见我的更新答案。我添加了将控件插入表单中特定位置的代码。此外，还可以使用

prepend（）

、

insertAfter（）

和

insertBefore（）

将控件放置在元素中的特定位置。

$("<input type='text' />").appendTo('.selector');

$(function() {

  // append input control at start of form
  $("<input type='text' value='' />")
     .attr("id", "myfieldid")
     .attr("name", "myfieldid")
     .prependTo("#form-0");

  // OR

  // append input control at end of form
  $("<input type='text' value='' />")
     .attr("id", "myfieldid")
     .attr("name", "myfieldid")
     .appendTo("#form-0");

  // OR

  // see .after() or .before() in the api.jquery.com library

});