使用Javascript，Jquery

Question

你能帮助我吗？

我想创建一个包含4个选项的下拉菜单：1,2,3,4。

• 当我选择1：显示1表格/ 1页
时
• 当我选择2：显示2个表格/ 1页
时
• 当我选择3：显示3个表格/ 1页
时
• 当我选择4：显示4个表格/ 1页
时

注意：对于1表单/ 1页的示例表单格式：

Name:
Country:
Button

2种表格/ 1页的表格格式：

Name:
Country:
<hr>
Name:
Country:
Button

我知道如何使用jQuery clone()方法，表单方法。但我只能创建2个表单/ 1页面。你能告诉我哪个规则我可以​​用来创建3个表格/ 1页？

Answer 1

你可以在这里使用选择框..你也可以使用它作为下拉列表..你必须自己编码..要求一个完整的代码不利于学习。

Answer 2

使用可以使用如下

$(function(){    
    
    $('select').change(function(){
        var element = $('#form').children('div:eq(0)');
        var html = [];
        for(var i=1; i<=parseInt($(this).val()); i++){
            html.push(element.clone());
        } 
        $('#form').html(html);
    });
    
});

label{width:100px;display:inline-block;margin-bottom:5px}

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<select>
    <option value="1">Display 1 form</option>
    <option value="2">Display 2 form</option>
    <option value="3">Display 3 form</option>
    <option value="4">Display 4 form</option>
</select>
<hr>
<form action="">
    <div id="form">
        <div>
            <label>Name : </label><input type="text" name="name[]" /><br/>
            <label>Country : </label><input type="text" name="country[]" />
            <hr>
        </div>
    </div>
</form>