如何使用javascript从html中的表格中获取选定的行？

Question

I have a html table and a button below it, I want to get the data from the selected row whenever that button is clicked. How shall I go about it?

Answer 1

If I understand what you mean, you want a user to be able to select a row out of a table by clicking on it. Then when they click the button, you can capture the selected row's data in each cell.

I'll use JQuery in the explanation.

You will want to create an event handler for a click event on a <tr> . When that <tr> is clicked, you can apply a CSS class such as .selected to it. Then when the user clicks the button, you have another event handler loop through the .selected class's children and return the values (which would be <td> 's).

$('tr').click(function() {
   $('.selected').removeClass('selected');
    $(this).addClass('selected');
});

$('#submit').click(function() {    
    $('.selected').children().each(function() {
        alert($(this).html());
    });
});

Here is a working example on JSFiddle using JQuery.