Question

我正在创建一些来自某些JSON的项目列表，而我正试图在点击该项目时获取该项目的“数据值”。到目前为止我已经

了

 var target = $('#list');
 target.empty();
 for (var i = 0; i < myJson.length; i++) {
     $('<tr class = "selectedItem">')
         .append($('<td>', {
             'text': myJson[i].id,
             'data-value':myJson[i].id
         }))
         .append($('<td>', {
             'text': myJson[i].name
         }))
         .append($('<td>', {
             'text': myJson[i].Details
         }))
     .appendTo(target);
 };

构建列表并在屏幕上显示。但是当用户点击其中一个项目时，我正在尝试获取ID。我添加了“selectedItem”类，以为我能够在点击事件上做一个但没有这样的运气。这就是我所拥有的：

  $('body').on('click', ".selectedItem", function () {
      var value = $(this).data('value');
      console.log(value);
  });

但我只是继续'未定义'。我做错了什么想法？感谢

Answer 1

您的活动位于tr，因此$(this)为tr。

尝试在selectedItem;）

上添加课程td

 var target = $('#list');
 target.empty();
 for (var i = 0; i < myJson.length; i++) {
     $('<tr>')
         .append($('<td class = "selectedItem">', {
             'text': myJson[i].id,
             'data-value':myJson[i].id
         }))
         .append($('<td>', {
             'text': myJson[i].name
         }))
         .append($('<td>', {
             'text': myJson[i].Details
         }))
     .appendTo(target);
 };

如果你将课程保留在tr：

上，你也可以检索第一个td

var value = $(this).children().first().data('value');

Answer 2

data-value位于第一个表格单元格上，而您的定位位于该行上。在这种情况下，您可以获得点击事件中<td>的{{1}}：

data-value

使用jQuery返回单击列表项的值

2 个答案: