编辑

Question

我有一个由firebase填充的表。我有按钮附加到表中的每一行。问题是我不知道如何区分彼此之间的按钮。

在ios中你会在cellForRowAtIndex中执行此操作

 UIButton *aButton=[[UIButton alloc]initWithFrame:aFrame];
 aButton.tag= A_BUTTON_TAG_CONSTANT + indexPath.row;

然后在您的选择器中，您将确定tableView中的哪个按钮被按下，您可以处理右侧数据部分的操作。在我的网络应用程序中，我有以下内容。

 function myCreateFunction(order) {
var table = document.getElementById("ordersTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
var cell4 = row.insertCell(3);
cell1.innerHTML = order.addressType;
cell2.innerHTML = order.totalPrice;
for(i in order.address) {
  var aCell=row.insertCell(i+3);
  aCell.innerHTML=order.address[i];
console.log (i, order.address[i])
}
 var timeSince=makeTimeStamp(order.timeStamp);
 var row = table.rows[index]; 
cell3.innerHTML=timeSince;
cell4.innerHTML = '<input id="Button" type="button"  value="click"     onclick="return btntest_onclick()" />';

}

每次在＆＃34; child_added＆＃34;事件发生。因此，表格像堆栈一样增长，最新的表格位于顶部。因此，最新的快照将填充在第0行，最旧的快照将在第n行，其中n是快照数。

现在我希望能够知道在表格中按下了哪个按钮，这样我就可以转到另一个页面并显示有关帖子的详细信息。那么我怎么知道哪个按钮被按下以及哪一行被定位？

Answer 1

在你的函数中保留除最后一行之外的代码，即 -

var table = document.getElementById("ordersTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
var cell4 = row.insertCell(3);
cell1.innerHTML = order.addressType;
cell2.innerHTML = order.totalPrice;
for(i in order.address) {
  var aCell=row.insertCell(i+3);
  aCell.innerHTML=order.address[i];
  console.log (i, order.address[i])
}
 var timeSince=makeTimeStamp(order.timeStamp);
 var row = table.rows[index]; 
 cell3.innerHTML=timeSince;

然后写下：

编辑

var button = document.createElement("button");
button.addEventListener("click", function(){
  myclickFunction(row);
}, false);
cell4.appendChild(button);

您的myClickFunction将如下所示：

//this function will be called for the each cell4 button and would contain that cell's row info
function myclickFunction(clickedRow){
  //do something with the row info of clicked button and form payload for rest api
  var payload = formPayload(clickedRow); //the payload formed from the clicked row
  sendAjaxOfThisRow(payload);
}

这样您就不需要添加id并在之后执行不必要的DOM操作。

Answer 2

所以最终找到了解决方案。我确实使用了Vineet的按钮解决方案。但他的解决方案不完整。我希望实现的主要是访问选择按钮的表格行中的信息。它是通过这种方式实现的。在我的按钮的选择器中我有以下

function myclickFunction()
{
var idex = $(this).closest('tr').index();
var idex1 = $(this).closest('tr').find('td:eq(0)').text();
var idex2 = $(this).closest('tr').find('td:eq(1)').text();
var idex3 = $(this).closest('tr').find('td:eq(2)').text();
//alert(document.getElementById("ordersTable").rows[0].innerHTML);
alert('<p><b>index:</b>' + idex + ' ' + idex1 + ' ' + idex2 + ' ' +   idex3 + '</p>');
}

我在其他地方找到了这个解决方案。虽然它并没有真正创建iOS的类似;这是预期的行为。在我看来，最接近的呼叫以某种方式获得父母。这将检索表行文本并解决问题。希望这有助于某人

在js中动态设置id到按钮

2 个答案:

编辑