javascript - 从表格单元格的输入字段中获取事件 .focusout

Question

首先，我有一个 Google 可视化数据表。

之后，我创建一个 for 循环来获取表格单元格值并将其放入输入字段中:

for (var y = 0, maxrows = data.getNumberOfRows(); y < maxrows; y++) {
    for (var x = 1, maxcols = data.getNumberOfColumns(); x < maxcols; x++) {

      data.setValue(y, x, '<input id="costRedovi" vr="'+ data.getValue(y,0) + '" kol="'+ data.getColumnLabel(x) +'" class="form-control" value="'+data.getValue(y,x)+'">');
    }
} 

现在每个值都进入表格单元格和输入字段。现在，当表准备就绪时，我可以更改这些值，但现在如何获取这些值，因为我的脚本现在生成此 HTML 代码。另外，我需要获取输入字段上的事件 .focusout 的值:

<tr class="google-visualization-table-tr-even google-visualization-table-tr-sel">
   <td class="google-visualization-table-td"><input id="costRedovi" vr="2013-04-01" kol="John Deer n7" class="form-control" value="0"></td>
   <td class="google-visualization-table-td"><input id="costRedovi" vr="2013-04-01" kol="Laza Lazic" class="form-control" value="0"></td>
</tr>

我尝试这样做:

new google.visualization.events.addListener(table, 'ready', function () {

    $("#costRedovi").focusout(function() {
        console.log($('#costRedovi').attr('value'));                        
    });

});

问题是现在每个输入都具有相同的 ID。

Answer 1

如果您要使用类而不是 ID，即:

<tr class="google-visualization-table-tr-even google-visualization-table-tr-sel">
  <td class="google-visualization-table-td"><input vr="2013-04-01" kol="John Deer n7" class="form-control costRedovi" value="0"></td>
  <td class="google-visualization-table-td"><input vr="2013-04-01" kol="Laza Lazic" class="form-control costRedovi" value="0"></td>
</tr>

然后您可以像这样检索未聚焦的输入:

$(".costRedovi").focusout(function() {
  var origval = $(this).attr('value');
  var editedval = $(this).val();

  console.log("before: " + origval + ", after:" + editedval);
});