Jquery单击按钮显示内容

时间:2014-09-10 05:14:17

标签: php jquery

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

1.这是代码块

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

显示

       </table>
     </body>

2.Scripting Code

<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元素隐藏并显示内容。但是如何动态地做到这一点

2 个答案:

答案 0 :(得分:0)

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

$(this).hide();

答案 1 :(得分:0)

你可以在每个td / div中创建一个动态div,并为所有这些动态div插入一个类。

DEMO HERE (JSFIDDLE)

基本上你需要在同一个div中使用parent()find()函数。

之后,仅使用show()