首页 > 解决方案 > 如何在 Vanilla JS 中用下拉菜单替换输入框

问题描述

我正在尝试用 Vanilla JS 替换输入框。目前我正在使用 jquery 来做到这一点。

column.replaceWith("<select id='" + column[0].id + "' name='" + column[0].id + "' class='" + column[0].className + "'></select>");

我正在将所有代码重构为 Vanilla JS,这是我需要做的最后一件事。我已经完成了 document.createElement('select'); 并创建了<select></select>元素。然后我试着做;

newEl.innerHTML += '<select id="selBidReceivedIsPM" name="selBidReceivedIsPM">'
                + '<option value="0">AM</option>'
                + '<option value="1">PM</option>';

,但这不会创建 ID 或名称。在过去的 3 个小时里,我一直在谷歌搜索和尝试,需要一些帮助来解决这个问题。

html:

 <label for="columnA5"></label>
 <input
       type="number"
       id="columnA5"
       name="columnA5"
       class="columnA"
       step="any"
 >

标签: javascript

解决方案


像这样的东西应该可以使用具有 value 和 innerHTML 的选项来创建选择。

var select = document.createElement('select');
select.id="selBidReceivedIsPM" 
select.name="selBidReceivedIsPM"
var val=2;
var time=["AM","PM"];
for (var i = 0; i<val; i++){
    var opt = document.createElement('option');
    opt.value = i;
    opt.innerHTML = time[i];
    select.appendChild(opt);
}
console.log(select)


推荐阅读