Question

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

Answer 1

您需要在子文本框中更改事件（但更好地定位键盘和更改事件）并根据在该字段上输入的子项数进行循环。在内部循环中，创建元素并最终将元素附加到结果中，请参见下面的示例：

假设这是您的 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

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

1 个答案: