如何在每个表格行的末尾添加按钮？答案

【问题标题】：How can I add buttons at the end of each table row?如何在每个表格行的末尾添加按钮？
【发布时间】：2019-06-07 04:55:05
【问题描述】：

我正在尝试在表格receitas 的每一行的末尾插入一个按钮，但按钮被设置在表格的开头而不是每行的末尾。

function mostraTabelaTeste(aTipo, aLista) {
    tb = '<table>';
    tb += '<tr><th>Tipo</th><th>Nome</th><th>Tempo</th><th>Custo</th><th>Dificuldade</th></tr>';
    for(let i in receitas) {
        if(receitas[i].tipo==aTipo) {
            tb += '<tr><td>' + receitas[i].tipo + '</td><td>' + receitas[i].nome + '</td><td> '+ receitas[i].tempo + '</td><td>' + receitas[i].custo + '</td><td>' + receitas[i].dificuldade + '</td></td><input type="button" id="remove_' + i + '" value="x"</td></tr>';
        }
    }
    tb += '<table>';
    document.getElementById(aLista).innerHTML = tb;
}

我将所有属性放入表格行的行（在 for 内部），我有一个输入，它应该设置在行的末尾，但相反，它会进入表格的顶部。

【问题讨论】：

输入标签未关闭<input type="button" id="remove_' + i + '" value="x"</td>
关闭表格标签。 tb += '';在最后
是的，这就是问题所在，“'”正在关闭 td 而不是打开...在电脑前的时间太长了谢谢大家！

标签： javascript html button html-table

【解决方案1】：

这只是包装您正在创建的按钮</td>而不是启动<td>的单元格中的类型错误

见下文 sn-p ：

receitas = [
  {tipo:"typ1",nome:"nome1",tempo:"tempo1",custo:"custo1",dificuldade:"dificuldade1"},
  {tipo:"typ2",nome:"nome2",tempo:"tempo2",custo:"custo2",dificuldade:"dificuldade2"},
  {tipo:"typ1",nome:"nome3",tempo:"tempo3",custo:"custo3",dificuldade:"dificuldade3"},
  {tipo:"typ1",nome:"nome4",tempo:"tempo4",custo:"custo4",dificuldade:"dificuldade4"},
]

function mostraTabelaTeste(aTipo, aLista) {
  tb = '<table>';
  tb += '<tr><th>Tipo</th><th>Nome</th><th>Tempo</th><th>Custo</th><th>Dificuldade</th></tr>';
  for (let i in receitas) {
    if (receitas[i].tipo == aTipo) {
      tb += '<tr><td>' + receitas[i].tipo + '</td><td>' + receitas[i].nome + '</td><td> ' + receitas[i].tempo + '</td><td>' + receitas[i].custo + '</td><td>' + receitas[i].dificuldade + '</td><td><input type="button" id="remove_' + i + '" value="x"</td></tr>';

    }
  }
  tb += '<table>';
  document.getElementById(aLista).innerHTML = tb;
}

mostraTabelaTeste("typ1","table");

&lt;div id="table"&gt;&lt;/div&gt;

【讨论】：

【解决方案2】：

您可能需要在第一行中为按钮列再添加一个。如下：

tb += '<tr><th>Tipo</th><th>Nome</th><th>Tempo</th><th>Custo</th><th>Dificuldade</th><th>&nbsp;</th></tr>';

【讨论】：