Jquery单击按钮显示内容 - Jquery Click Buttons Show Content

Jquery Click Buttons Show Content

本文关键字：显示按钮单击 Jquery | 更新日期: 2023-09-27

使用Jquery，我想在单击按钮时显示元素上的内容。每列中都有按钮。当我点击时，当我点击按钮时，应该会显示相应的内容。

1.这是代码块

  <html>
     <body>
       <table>
          <tr>
             <td><div><button type="button" class="addButton">

显示

       </table>
     </body>

2.脚本代码

<script type="text/javascript">
$(document).ready(function(){ 
  $(".addButton").click(function(event){
       var tdCount=$("#addInf.addInfo").length;
       //length of the td elements
       alert(tdCount);

       for(var $i=0;$i<tdCount;$i++){
           alert($i);
           $(".addButton:eq(0)").hide(); 
          // $(".addButton:eq($i)").hide();

//无法隐藏第i个元素

        }                                
    });     
});

我的问题是第一个元素是隐藏的。我想在点击按钮时动态显示第一列td和第二列td的内容，以此类推//并隐藏按钮，我也可以为一个td元素隐藏和显示内容。但是如何动态地进行

按钮点击事件处理程序的上下文是按钮本身。为了隐藏它，你可以简单地做：

$(this).hide();

您可以在每个td/div中创建一个动态div，并向所有这些动态div插入一个类。

此处演示（JSFIDDLE）

基本上，您需要在同一个分区内使用parent()和find()函数。

之后，只使用show()