jquery - 使用 jquery 获取表中某一行的某些属性

Question

我有一个像这样的 html 表格:

<table class="table table-bordered table-striped table-condensed" id="table1">
<thead>
    <tr>
        <th>No.  </th>
        <th>No Request</th>
        <th>Username</th>
        <th>Start Time</th>
        <th>Complaint</th>                                            
        <th>Estimation</th>                                            
        <th>Action</th>
    </tr>
</thead>   
<tbody>
    <tr>
        <td class="center">1.  </td>

        <td class="sorting1" id='no_request' data-id-reseh="001">TMS/IT/04/001</td>

        <td class="center">Erika</td>

        <td class="center">06-04-2015, 18:26 </td>

        <td class="center" id="description">Erika yang minta</td>                                            

        <td class="center">06-04-2015, 18:56 </td>                                            

        <!-- Action-action -->
        <td  class="center">
            <a class="btn btn-info" id="btn-edit" name="edit"  data-toggle="modal" data-target="#myModal" role="button" title="Beri Keterangan Request No. 1">
                <i class="halflings-icon white edit"></i>
                Comment
            </a>

            <a class="btn btn-warning" >
                <i class="halflings-icon white arrow-up" id="print" email="tmsmkt1@tresnamuda.co.id"></i>
                Approve 
            </a>         
        </td>
    </tr>

    <tr>
        <td class="center">2.  </td>

        <td class="sorting1" id='no_request' data-id-reseh="002">TMS/IT/04/002</td>

        <td class="center">Ullinawati</td>

        <td class="center">06-04-2015, 18:27 </td>

        <td class="center" id="description">Ullie yang minta</td>                                            

        <td class="center">06-04-2015, 18:57 </td>                                            

        <td  class="center">
            <a class="btn btn-info" id="btn-edit" name="edit"  data-toggle="modal" data-target="#myModal" role="button" title="Beri Keterangan Request No. 2">
                <i class="halflings-icon white edit"></i>
                Comment
            </a>

            <a class="btn btn-warning" >
                <i class="halflings-icon white arrow-up" id="print" email="ullie@tresnamuda.co.id"></i>
                Approve 
            </a>         
        </td>
    </tr>

</tbody>

我的问题是，我可以根据表的行 grep 属性“email”吗？ 所以可以说，第一行是=“tmsmkt1@tresnamuda.co.id”，第二行是=“ullie@tresnamuda.co.id”。 我编写了一些像这样的 jquery 代码:

  $(document).ready(function() {
    $(".btn-warning").click(function(e) {
        e.preventDefault();

        var $this = $(this);
        var idStr = $this.attr("email");

        console.log($this.attr('email')); // Failed
        console.log(idStr); // failed too

    });

感谢您的帮助...

Answer 1

由于 email 属性附加在 i 元素上，该元素是 btn-warning 的子元素，因此需要使用 查找()

$(".btn-warning").click(function(e) {
    e.preventDefault();
    console.log($(this).find("i").attr('email')); 
});

find() 将获取子元素。 Fiddle