Javascript getElementById 基于使用固定名称和输入数字形成的 ID

Question

我正在尝试在 HTML 对象中动态创建 ID，并在我的 javascript 中使用 getElementById() 来根据我单击的按钮访问 HTML 输入值，并将其插入到各自的 HTML 选择列表中。

我的 HTML 片段:

<input type="text" id="addDesc1"><input type="button" value="Add" onclick="addDescText(1)"> 
<input type="text" id="addDesc2"><input type="button" value="Add" onclick="addDescText(2)">
....
....
<select id="desc1">....</select>
<select id="desc2">....</select> 

我的 javascript 片段:

function addDescText(id) {
    var descText = document.getElementById("addDesc".concat(id)).value;
    var selList = document.getElementById("desc".concat(id));
    ....
    ....
    some javascript to add the respective description to their respective select list
    ....
}

Answer 1

concat()是一个数组方法，你不能在字符串上使用它。只需使用 + 将参数与字符串连接起来。

演示:

function addDescText(id) {
  var descText = document.getElementById("addDesc"+id).value;
  var selList = document.getElementById("desc"+id);

  console.log(descText);
  console.log(selList);
}

<input type="text" id="addDesc1"><input type="button" value="Add" onclick="addDescText(1)"> 
<input type="text" id="addDesc2"><input type="button" value="Add" onclick="addDescText(2)">

<select id="desc1">....</select>
<select id="desc2">....</select>