javascript - 使用 javaScript 创建新的输入字段

标签 javascript html

<分区>

我是 javaScript 的新手,现在不知道如何实现这一点。我的 HTML 中有带数字的“选择”。

<select class="form-control"  id="select" >
    <option>1</option>
    <option>2</option>
    <option>3</option>
</select>

当用户在此选择中选择数字时,js 将创建与用户选择的一样多的输入字段,如上图[

enter image description here

如何做到这一点?

最佳答案

这只是为了让您了解如何操作。

addImputs(select);


select.addEventListener("change", ()=>{
  
  addImputs(select);
  
})

function addImputs(select){
 let num = parseInt(select.options[select.selectedIndex].value);
  imputs.innerHTML = "";
  for(let i = 0; i < num; i++){
  let imp = document.createElement("input");
  imp.setAttribute("type", "text");
  imputs.appendChild(imp)
}
}
<select class="form-control"  id="select" >
    <option>1</option>
    <option>2</option>
    <option>3</option>
</select>

<div id="imputs"></div>

关于javascript - 使用 javaScript 创建新的输入字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52460297/

相关文章:

javascript - 热门获取基于显示名称的选择选项值?

javascript - 在 Mint 17.3 上启动 python 脚本的权限被拒绝

javascript - React/Redux 服务器端渲染中的警告 : Did not expect server HTML to contain a <li> in <ul>.

javascript - 为什么 Firefox 1.5 不能解析 SELECT 下拉菜单的 DOM 子项?

html - 如何在 anchor 处于事件状态时显示 div?

javascript - PouchDb 通过 Id 匹配正则表达式获取所有文档

javascript - 避免 html 页面中存在多个 src 文件

html - 为什么右浮动会影响其下方元素的布局?

Javascript/JQuery 等待用户输入

javascript - 模式内的链接在打开模式之前出现并弄乱了页面界面