Jquery 在HTML表中仅选择一列

我需要使用鼠标指针从HTML表中选择单个列的文本

例如，请考虑下表。

在此表中，我无法单独选择Lastname列的文本。相反，在向下拖动鼠标时，也会选择表的其余内容

最终目的是分别选择每一列。有没有办法选择表中单个列的文本

---

尝试了-moz用户选择的所有不同选项，但都没有成功

为了对齐，您还可以在表中包含表

仅示意图：

OuterTable(
           td(leftColumnTable)/td 
           td(midColumnTable)/td
           td(rightColumnTable)/td
           )
/OuterTable

---

这将允许突出显示单个列以及完整的表。

在姓氏中添加一个类，并添加此css属性

这是另一条路。 表，th，td{ 边框：1px纯黑； } .不可选择{ -webkit触摸标注：无； -webkit用户选择：无； -khtml用户选择：无； -moz用户选择：无； -ms用户选择：无； -o-用户选择：无； 用户选择：无； } .可选{ -webkit触摸标注：全部； -webkit用户选择：全部； -khtml用户选择：全部； -moz用户选择：全部； -ms用户选择：全部； -o-用户选择：全部； 用户选择：全部； } 在lastname中添加一些css 名字 姓氏 彼得 格里芬 露易丝 格里芬 获取第二列。 表th:nth-child2，表td:nth-child2{ 背景：红色； } 名字 姓氏 姓 弗莱德 弗兰金 迈克 迈克 弗兰金 琼斯

---

如果希望列是可选择的，则必须在HTML中提供该结构。这将涉及在表中使用表，如下所示：

基本方法是用一行创建一个外部表。该行具有所需的任意多个列td元素。虽然示例显示了三个元素，但它可以轻松地调整为您想要/需要的任意数量的列

这些td元素包含它们自己的表，其中只有行，每行只有一列。现在可以单独选择列

<table><tr>

    <td>
      <table>
        <tr><th>First name</th></tr>
        <tr><td>David</td></tr>
        <tr><td>Frank</td></tr>
        <tr><td>Bob</td></tr>
      </table>
    </td>

    <td>
      <table>
        <tr><th>Last name</th></tr>
        <tr><td>David</td></tr>
        <tr><td>Frank</td></tr>
        <tr><td>Bob</td></tr>
      </table>
    </td>

    <td>
      <table>
        <tr><th>Third name</th></tr>
        <tr><td>David</td></tr>
        <tr><td>Frank</td></tr>
        <tr><td>Bob</td></tr>
      </table>
    </td>  

</tr></table>

---

这个问题很老，但我不太喜欢其他答案。它们似乎比必要的更复杂。我只是简单地分配了课程

.专栏2{ } 名字 姓氏 格雷格 史密斯 山姆 燧石

---

我也需要有可选的HTML列。来自@davidvandriesche的答案让我走上了正确的道路，但就像@Naja2Raja一样，我需要一个动态列解决方案。我相信下面的PHP代码可以引导您找到一个动态未知列计数解决方案

<?php
$con=mysqli_connect("localhost","","","test");
// Check connection
if (mysqli_connect_errno())
  {
    echo "Failed to connect to MySQL: " . mysqli_connect_error();
  }

$sql="SELECT fName,email FROM Persons ORDER BY fname";

if ($result=mysqli_query($con,$sql))
  {
    // Start an HTML table for each field
    $table0 = "<table id=\"table0\" name=\"table0\">
              <tr><th>Last Name</th></tr>
    ";

    $table1 = "<table id=\"table1\" name=\"table1\">
              <tr><th>Age</th></tr>
    ";

   // Fetch one and one row
   while ($row=mysqli_fetch_row($result))
   {
    $table0 .= "<tr><td>". $row[0] ."</td></tr>\n";
    $table1 .= "<tr><td>". $row[1] ."</td></tr>\n";
   }

// Free result set
mysqli_free_result($result);

// Close HTML table
  $table0 .= "</table>";
  $table1 .= "</table>";

// Place HTML Column Tables into Single Row HTML table with a <td> 
// column for each HTML Column Table
echo "<table><tr>
        <td>
          $table0 
        </td>
        <td>
          $table1
        <td>
      </tr></table>";

}

mysqli_close($con);
?>

---

三个表，每个表只有一列？如果列数固定，则可以。但在我的例子中，列数是动态的，而且我认为这可能不是一种正确的方法。我的问题是在拖动时选择文本，您提供的解决方案只会悬停，但当我单击并拖动时，仍然会选择其他项。选择Lastname列也会选择其他列值。试着用鼠标选择Lastname、Fred和Flinstone的内容，你会注意到。几乎可以，但我的问题不是一列，而是分别选择每列的值。将可选类添加到多个列可能不起作用。尽管如此，还是要感谢您。很抱歉，我不知道如何实现上述代码？您错过了OP中的问题要点。这不是关于在CSS中选择列，而是关于使用鼠标并进行仅选择特定列的拖动选择。使用您提供的解决方案无法实现这一点。

<?php
$con=mysqli_connect("localhost","","","test");
// Check connection
if (mysqli_connect_errno())
  {
    echo "Failed to connect to MySQL: " . mysqli_connect_error();
  }

$sql="SELECT fName,email FROM Persons ORDER BY fname";

if ($result=mysqli_query($con,$sql))
  {
    // Start an HTML table for each field
    $table0 = "<table id=\"table0\" name=\"table0\">
              <tr><th>Last Name</th></tr>
    ";

    $table1 = "<table id=\"table1\" name=\"table1\">
              <tr><th>Age</th></tr>
    ";

   // Fetch one and one row
   while ($row=mysqli_fetch_row($result))
   {
    $table0 .= "<tr><td>". $row[0] ."</td></tr>\n";
    $table1 .= "<tr><td>". $row[1] ."</td></tr>\n";
   }

// Free result set
mysqli_free_result($result);

// Close HTML table
  $table0 .= "</table>";
  $table1 .= "</table>";

// Place HTML Column Tables into Single Row HTML table with a <td> 
// column for each HTML Column Table
echo "<table><tr>
        <td>
          $table0 
        </td>
        <td>
          $table1
        <td>
      </tr></table>";

}

mysqli_close($con);
?>