我有一个如下表:

<头>

标头	另一个标题
首先（一些-文本-最初-隐藏）单击	行

在“单击”时哪个变为

<头>

标头	另一个标题
首先（一些-文本-应该-现在可见）单击	行

在“单击”上，文本“some-text-initial-hidden”在“单击”后不显示，我想在“单击”上显示和隐藏文本 我有一个工作表，如下所示:jsfiddle

代码： HTML:

<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table style="font-size: 13px;"> 

<th> header1</th>
<th> header2 </th>

<tbody>
   <tr class="test">
        <td>data-always-visible
            <span class="complete">some-data-to hide and show</span>
            <br>
            <i class="fa fa-chevron-down" style="font-size: 9px;">Click for more details of </i>
        </td>
        <td> some data...</td>
   </tr>
  
</tbody>
</table>

CSS:

<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table style="font-size: 13px;"> 

<th> header1</th>
<th> header2 </th>

<tbody>
   <tr class="test">
        <td>data-always-visible
            <span class="complete">some-data-to hide and show</span>
            <br>
            <i class="fa fa-chevron-down" style="font-size: 9px;">Click for more details of </i>
        </td>
        <td> some data...</td>
   </tr>
  
</tbody>
</table>

js/jQuery:

<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table style="font-size: 13px;"> 

<th> header1</th>
<th> header2 </th>

<tbody>
   <tr class="test">
        <td>data-always-visible
            <span class="complete">some-data-to hide and show</span>
            <br>
            <i class="fa fa-chevron-down" style="font-size: 9px;">Click for more details of </i>
        </td>
        <td> some data...</td>
   </tr>
  
</tbody>
</table>

提前感谢。

---

顺晟科技：

您使用了错误的选择器，它应该并且应该使用替代。

<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table style="font-size: 13px;"> 

<th> header1</th>
<th> header2 </th>

<tbody>
   <tr class="test">
        <td>data-always-visible
            <span class="complete">some-data-to hide and show</span>
            <br>
            <i class="fa fa-chevron-down" style="font-size: 9px;">Click for more details of </i>
        </td>
        <td> some data...</td>
   </tr>
  
</tbody>
</table>

https://jsfiddle.net/viethien/dbc349gm/6/

我更新了代码以显示/隐藏您的div

<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table style="font-size: 13px;"> 

<th> header1</th>
<th> header2 </th>

<tbody>
   <tr class="test">
        <td>data-always-visible
            <span class="complete">some-data-to hide and show</span>
            <br>
            <i class="fa fa-chevron-down" style="font-size: 9px;">Click for more details of </i>
        </td>
        <td> some data...</td>
   </tr>
  
</tbody>
</table>

是。只搜索提供的元素本身及其祖先。

可以改为使用。