Question

我想将一个或多个列的内容写入数组。也应该可以取消选择列。我使用以下代码来解决该列，但现在我不知道如何获取内容。

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

example in JSFiddle

感谢任何帮助。

Answer 1

试试这个：

$(document).ready(function(){
    var text = [];
$("td").click(function () {
    var columnNo = $(this).index();
    $(this).closest("table")
        .find("tr td:nth-child(" + (columnNo + 1) + ")")
        .toggleClass("selected");
    var val = $(this).closest("table")
        .find("tr td:nth-child(" + (columnNo + 1) + ")").text(); // to get column text
    if($(this).hasClass( "selected" )){ //to check whether user selected or not
        if($.inArray(val,text)<0){ //check value exists in array
            text.push(val);
        }
    }else{
        text.splice($.inArray(val, text),1); //if user deselect remove column text from array
    }
    console.log(text);
});
});

<强> DEMO

Answer 2

DEMO

$("td").click(function () {
    var columnNo = $(this).index();
    var $arr = $(this).closest("table")
        .find("tr td:nth-child(" + (columnNo + 1) + ")")
        .toggleClass("selected").map(function() {
            return ($(this).hasClass('selected')) ? $(this).text() : "";
          }).get();
    console.log($arr);//$arr is the array of TD values of a column you've clicked
});

Answer 3

为元素添加class / custom属性。然后使用类名称选择它们。

 $(this).closest("table").find("tr td:nth-child(" + (columnNo + 1) + ")").addClass('yourOwnClassName');

可以使用类名提取所有 td 。也给你表id。

var selectedRows =$('#mytable .yourOwnClassName');

要选择并取消选择，您可以将css添加到您的课程中。因此，添加和删除类将完成显示所选内容的工作。

Answer 4

$("td").click(function () {
    var columnNo = $(this).index();
    $(this).closest("table")
        .find("tr td:nth-child(" + (columnNo + 1) + ")")
        .css("color", "red");
var array1 = [];
    for(var i = 0;i <= ($("table tr").length - 1); i++){
        array1[i] = $("table").find("tr:nth-child(" + (i + 1) + ")").find("td:nth-child(" + (columnNo + 1) + ")").text();
        };
        alert(array1);
});

DEMO

多选和取消选择列 - jquery

4 个答案: