遍历一个html表

时间:2016-03-18 05:36:38

标签: javascript jquery html

我有一个具有这种结构的表:

proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'

有人能告诉我怎么做吗?

提前致谢。

编辑1:有多个相同类型的行,点击特定的复选框会提醒相应的<table> <tr> <td><a href = "#">link1</a></td> <td><a href = "#">link2</a></td> <td><a href = "#">link3</a></td> <td><input type = "checkbox" onclick = "func()"></td> </tr> </table> function func(){ //I have to alert link1 here. } 文字。

2 个答案:

答案 0 :(得分:2)

您可以使用jquery执行此操作。只需更改eq的数量即可。所有包含inputclass checkbox $('.checkbox').on('click',function(){ var e = $(this).closest('table').find('td a'); alert(e.eq(0).text()); });的表格都会运行。你可以玩它。

&#13;
&#13;
table{
  border: 1px solid red;
  margin-bottom: 5px;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table class="table1">
  <tr>
    <td><a href = "#">link1</a></td>
    <td><a href = "#">link2</a></td>
    <td><a href = "#">link3</a></td>
    <td><input type = "checkbox" class="checkbox"></td>
  </tr>
</table>
<table class="table2">
  <tr>
    <td><a href = "#">link4</a></td>
    <td><a href = "#">link5</a></td>
    <td><a href = "#">link6</a></td>
    <td><input type = "checkbox" class="checkbox"></td>
  </tr>
</table>
&#13;
{{1}}
&#13;
&#13;
&#13;

答案 1 :(得分:0)

由于您使用的是jQuery,请使用jQuery处理程序,您可以在其中找到同一行中的a

jQuery(function($) {
  $('#my-table input[type="checkbox"]').change(function() {
    alert($(this).closest('tr').find('td:first-child a').text())
  });
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="my-table">
  <tr>
    <td><a href="#">link-1-1</a></td>
    <td><a href="#">link-1-2</a></td>
    <td><a href="#">link-1-3</a></td>
    <td>
      <input type="checkbox">
    </td>
  </tr>
  <tr>
    <td><a href="#">link-2-1</a></td>
    <td><a href="#">link-2-2</a></td>
    <td><a href="#">link-2-3</a></td>
    <td>
      <input type="checkbox">
    </td>
  </tr>
</table>