如何在javascript中将动态ID放在复选框中?

Posted

技术标签:

【中文标题】如何在javascript中将动态ID放在复选框中?【英文标题】:How to put Dynamic id in checkbox in javascript? 【发布时间】:2021-07-23 11:51:34 【问题描述】:

我将我的 html 代码附加到一个变量(ctableData),我再次将其附加到主容器。 现在我想为复选框设置动态 id,所以我正在运行一个循环并在每次迭代中增加 k 的值,然后将 k 分配为复选框 id。但这似乎不起作用?

for(let k =1; k< x.length; k++)
ctableData += '<div class="table_container"><table id="table1" class="checkboxdiv"><tbody><tr><th>'+plan[0].medicalPlans[i].brokerName+' <input type="checkbox" id= k name="table1" value="table1" onchange="myFunction(event)"> </th></tr>

【问题讨论】:

使用模板字符串。 试试this。另外,请阅读this 帖子。 【参考方案1】:

使用带有反引号的template string。

for(let k =1; k< x.length; k++)
ctableData += `<div class="table_container">
    <table id="table1" class="checkboxdiv">
      <tbody>
        <tr>
          <th>'+plan[0].medicalPlans[i].brokerName+' 
            <input type="checkbox" id=$k name="table1" value="table1" onchange="myFunction(event)" /> 
          </th>
        </tr>
      </tbody>
      </table>
    </div>`

【讨论】:

【参考方案2】:

您的代码的问题是您没有使用 k 的值。您将 k 放在不计算为循环变量的字符串中。就像你对plan[0].medicalPlans[i].brokerName 所做的那样使用它:

 for (let k = 1; k < x.length; k++) 
  ctableData += '<div class="table_container">
                   <table id="table1" class="checkboxdiv"><tbody><tr><th>' 
                  + plan[0].medicalPlans[i].brokerName + ' 
                    <input type="checkbox" id=' + k + ' name="table1" 
                   value="table1" onchange="myFunction(event)"> </th></tr>
     

【讨论】:

【参考方案3】:

尝试使用模板文字。

for(let k =1; k< x.length; k++)
ctableData += 
`<div class="table_container">
     <table id="table1" class="checkboxdiv">
         <tbody>
             <tr>
                 <th>'+plan[0].medicalPlans[i].brokerName+'
                    <input type="checkbox" id=$k name="table1" value="table1" 
                    onchange="myFunction(event)"> 
                 </th>
             </tr>
         <tbody>
     <table>
</div>`

【讨论】:

以上是关于如何在javascript中将动态ID放在复选框中?的主要内容,如果未能解决你的问题,请参考以下文章

在 JavaScript 中将对象转换为数组以进行存储并返回数组以用于应用程序

如何在Javascript中将隐藏的ID列表添加到表单中?

Javascript DOM如何隐藏不合适的复选框

如何在struts 2中将迭代器索引值传递给Javascript?

如何在php中获取多个选定(动态)复选框的值?

如何将事件侦听器添加到动态创建的复选框并检查是不是选中了复选框。 JavaScript