首页 > 解决方案 > 如何在 TAG 上附加两个不同的 ID

问题描述

我想在我的表中附加两个不同的 ID,并在单击表的按钮时在控制台日志中显示 ID 结果<tr>

我的代码:

var id1 = snap.child("id").val();
var id2 = snap.child("idPaciente").val();
$("#tbl").append("<tr data-id1='"+id+"' data-id2='"+id2+"'><td>"
  + nome + "</td><td>"
  + apelido + "</td><td>"
  + mensagem + "</td><td>"
  + "<button type='button' id='btn'>Responder</button></td></tr>");

  $("#tbl").on('click', '#btn', function (e) {
    var $row = $(this).closest('tr'), rowId1 = $row.data('id1'), rowId2 = $row.data('id2');
    var rowId1 = $row.data('id1');
    var rowId2 = $row.data('id2');

    console.log("ID1: " + rowId);
    console.log("ID2: " + rowId2);

});

我的 console.log 结果:

ID1: -LtUdCRBBuUgIRzkrN48
ID2: undefined

标签: javascript

解决方案


几个问题

  1. 你一直忘记 id1 上的 1
  2. 您需要在按钮上使用类,而不是 ID
  3. 你有两条不必要的线

我假设火力基地,所以我假装我有快照。

将第一行改回

var id1 = snap.child("id").val(), id2 = snap.child("idPaciente").val();

当你对我的代码感到满意时

/* For testing */

// var id1 = snap.child("id").val(), id2 = snap.child("idPaciente").val(); 


var snap = null;
var id1 = snap ? snap.child("id").val() : "x",
  id2 = snap ? snap.child("idPaciente").val() : "y"
  
var nome = "Name 1",  apelido = "Bla", mensagem = "bla bla"

/* end testing */

$("#tbl").append("<tr data-id1='" + id1 /* TYPO */ + "' data-id2='" + id2 + "'><td>" +
  nome + "</td><td>" +
  apelido + "</td><td>" +
  mensagem + "</td><td>" +
  "<button type='button' class='btn'>Responder</button></td></tr>");

$("#tbl").on('click', '.btn', function(e) {
  var $row = $(this).closest('tr'),
    rowId1 = $row.data('id1'), // TYPO
    rowId2 = $row.data('id2');
  // var rowId1 = $row.data('id1'); // not needed
  // var rowId2 = $row.data('id2'); // not needed

  console.log("ID1: " + rowId1); // TYPO
  console.log("ID2: " + rowId2);

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody id="tbl"></tbody>
</table>


推荐阅读