Bộ chọn jQuery để lấy các ô trong cùng một cột

Question

Với bảng nhiều cấp, nhiều cột, làm cách nào tôi có thể chọn tất cả các ô trong cùng một cột làm bất kỳ ô tùy ý nào (ví dụ: ô được nhấp vào).

Cái gì như:

$("td").click(function(){ 
    var columnNo = $(this).columnNo? 
    $(this).closest("table").find("tr td:eq("+columnNo+")").css("color", "red"); 
}); 

tôi cần phải làm điều này mà không cần đặt tên cho các cột riêng. Ví dụ. nó nên làm việc trên đánh dấu đơn giản chung table mà không cần thêm lớp học hoặc ID.

Answer 1

nỗ lực của bạn là đúng, tất cả các bạn cần làm là sử dụng .index để tìm cột số-chỉ số của <td> trong hàng. Bạn cũng cần phải sử dụng nth-child-selector để khớp các chỉ mục cột của các phần tử <td> khác.

$("td").click(function(){ 
    var columnNo = $(this).index(); 
    $(this).closest("table") 
     .find("tr td:nth-child(" + (columnNo+1) + ")") 
     .css("color", "red"); 
}); 

Answer 2

Điều này có thể được thực hiện bằng phương pháp jQuery eq.

var $tds = $("td"); // get all tds beforehand, so jquery doesn't 
        // need to hit the DOM every click 

$("td").on("click", function() { 
    var position = $(this).index(), 
     $tdsInColumn = $tds.filter(":nth-child(" + index + ")"); 

    // manipulate $tdsInColumn in any way 
    $tdsInColumn.addClass("selected"); 
}); 

Không chắc chắn đây là cách hiệu quả nhất để làm như vậy, nhưng đó là giải pháp tôi đưa ra khi đối mặt với cùng một vấn đề trong khi quay trở lại.

Reference

jQuery.eq