Question

我想在每个具有类.ui-icon-trash的元素上添加一个click处理程序，它需要提供一个数据表对象（我已经这样）和应该删除的行。我不知道如何迭代我的元素来添加clickhandler，我也不知道如何检索每次迭代的当前tr。

 $(".ui-icon-trash").click(function(){
        deleteRowFromTable(oTable, ????The TR of the current element????);          

    });

这是我的表

        <table id="table_id" class="display">
        <thead>
            <th>Property</th>
            <th>Value</th>      
            <th></th>
        </thead>
        <tbody>
            <button id="create-property">Create new property</button>

            <tr >
                <td>mailAddress_object</td>
                <td id="mailAddress_object" >Message from SendALL 2.5</td>      
                <td><span class="ui-icon ui-icon-trash" id="deleteRow_1" name="mailAddress_object"></span></td>                     
            </tr>       

            <tr >
                <td>mjmj</td>
                <td id="mjmj" >xcvxcv</td>      
                <td><span class="ui-icon ui-icon-trash" id="deleteRow_2" name="mjmj"></span></td>                       
            </tr>       

            <tr >
                <td>olol</td>
                <td id="olol" >kjkkjk</td>      
                <td><span class="ui-icon ui-icon-trash" id="deleteRow_3" name="olol"></span></td>                       
            </tr>       

            <tr >
                <td>plsUrl</td>
                <td id="plsUrl" >http://komm2.srs-management.de</td>        
                <td><span class="ui-icon ui-icon-trash" id="deleteRow_4" name="plsUrl"></span></td>                     
            </tr>       

            <tr >
                <td>scPwd</td>
                <td id="scPwd" >sysadm</td>     
                <td><span class="ui-icon ui-icon-trash" id="deleteRow_5" name="scPwd"></span></td>                      
            </tr>       

            <tr >
                <td>smtp</td>
                <td id="smtp" >YOUR_MAILSERVER</td>     
                <td><span class="ui-icon ui-icon-trash" id="deleteRow_6" name="smtp"></span></td>                       
            </tr>       

            <tr >
                <td>test</td>
                <td id="test" >test3</td>       
                <td><span class="ui-icon ui-icon-trash" id="deleteRow_7" name="test"></span></td>                       
            </tr>       

            <tr >
                <td>useEncryption</td>
                <td id="useEncryption" >false</td>      
                <td><span class="ui-icon ui-icon-trash" id="deleteRow_8" name="useEncryption"></span></td>                      
            </tr>       

        </tbody>    
        </table>

Answer 1

试试这个

$("body").on('click', ".ui-icon-trash" ,function(){

    var $closestTr = $(this).closest('tr');  // This will give the closest tr
                            // If the class element is the child of tr          

     $closestTr.remove() ;  // Will delete that
 });

您需要在跨度内添加一些文本，否则您无法看到跨度.. 我刚刚将删除文本添加到范围with class .ui-icon-trash

CHECK FIDDLE

如何将click处理程序添加到具有某个类的每个元素？

1 个答案: