當孩子選擇時添加孩子的年齡

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