Javascript 如何使用Jquery和下拉列表填充Div

如示例所示，我对如何填充div有点困惑，假设我有以下下拉列表和div：

<div id='drop'>
    <select name='option'>
        <option value="Opt1">Opt1</option>
        <option value="Opt2">Opt2</option>
        <option value="Opt3">Opt3</option>
    </select>
</div>

<div id = 'NewContent'>

</div>

我如何将以下内容放入Div：

<form>
First name: <input type="text" name="firstname"><br>
Last name: <input type="text" name="lastname">
</form>

名字：

姓氏：

---

例如，如果用户要选择Opt2，这就是您想要的吗

$('select[name="option"]').change(function() {
   if($( "select.foo option:selected").val() == 'Opt2'){
       $('#NewContent').html('<form> \
                              First name: <input type="text" name="firstname"><br> \
                              Last name: <input type="text" name="lastname"> \
                              </form>');
   }
});

$（'select[name=“option”]”）。更改（函数（）{
if（$（“select.foo option:selected”）.val（）{
$（'#NewContent'）.html（'\
名字：
\
姓氏：\
');
}
});

执行以下操作：

将您的html更改为：

<div style="display:none" id="hold">
    <form>
    First name: <input type="text" name="firstname"><br>
    Last name: <input type="text" name="lastname">
    </form>
 <div>

---

您可以使用类似以下jQuery的内容来附加表单：

$('select[name="option"]').change(function () {
    if (this.value == 'Opt2') {
        var form = $('#test');
        if (form.length == 0) {
            $('#NewContent').html('<form id="test">First name: <input type="text" name="firstname"><br>Last name: <input type="text" name="lastname"></form>');
        }
    }
});

$（'select[name=“option”]”）。更改（函数（）{
if（this.value==“Opt2”）{
变量形式=$（“#测试”）；
如果（form.length==0）{
$（'#NewContent'）.html（'名字：
姓氏：'）；
}
}
});

---

克里斯的解决方案还可以。
另一种方法是在NewContent div中包含html：

<div id = 'NewContent'>
 <form>
   First name: <input type="text" name="firstname"><br>
   Last name: <input type="text" name="lastname">
  </form>
</div> 

因此，当您单击：

$('select[name="option"]').change(function() {
   $( 'form', '#NewContent').show();
});

<div id = 'NewContent'>
 <form>
   First name: <input type="text" name="firstname"><br>
   Last name: <input type="text" name="lastname">
  </form>
</div> 

#NewContent form {
    display:none;
}

$('select[name="option"]').change(function() {
   $( 'form', '#NewContent').show();
});