当孩子选择时添加孩子的年龄

Question

对编程很新颖。建立一个表格，提出基本问题，如年龄，结婚与否，有多少孩子。 当用户从箭头键选择1或2或3个孩子时，我想显示用户可以输入孩子的年龄和姓名的字段。这必须在提交按钮之前完成。 一个示例是hotels.com主页，其中，如果您有孩子，并且选择了所选孩子的年龄，则会显示房间预订选项。 Javascript会更好，但愿意做任何事。 请帮忙。

Answer 1

您需要更改事件（但更好地同时针对keyup和更改事件）关于孩子的文本框，并根据在该字段上输入的孩子的数量进行循环。内部循环，创建元素，最后追加元素融入到结果，见下面的例子：

假设这是你的HTML

<div> 
    Child : 
    <input type="number" min="0" max="5" id="kids" name="kids"/> 
</div> 
<!-- display output inside this element --> 
<div id="output"></div> 

这是你的JS

$('#kids').on('change keyup', function() {  
    // get value of child(number) 
    var val = $(this).val(); 
    // checking if entered more than 5 or any number(its depend) 
    if (val > 5) { 
    alert('opps no more than 5'); 
    return; 
    } 
    // every time child number's updated 
    // clear the container 
    $('#output').empty(); 
    var output; 
    for (var i = 0, length = val; i < length; i++) { 
    output = 'Name :<input type="text" name="name"/><br/>Age : <input type="text" name="age"/><hr/>'; 
    // append the element 
    $('#output').append(output); 
    } 
}); 

这只是一个例子，希望你得到它。

DEMO