jquery - Display rowIndex for dropdown in each row of the table

Question

I am trying to echo the rowIndex of the row in a table, when the dropdown (in td tags) in that row changes and its options (selectdevice is the class for the dropdowns). Currently i am getting undefined being displayed:

$('#tabletomodify').on('change','.selectdevice', function () {
  alert( this.parentNode.rowIndex );
  var optionSelected = $("option:selected", this);
  var valueSelected = this.value;                               
});

Answer 1

问题可能是this元素select，因此this.parentNode将是td元素而不是tr具有rowIndex属性的元素。在这种情况下，您需要找到 所属的tr元素select。

因此，假设select是元素的直接子td元素，您可以尝试访问父元素的（td）父元素。

alert( this.parentNode.parentNode.rowIndex );

演示：小提琴

或使用 jQuery，您可以使用.closest()tr找到父元素

alert( $(this).closest('tr').prop('rowIndex') );

演示：小提琴