jQuery選擇器

Question

我有以下HTML表：

<table class="display" style="width: 1000px;" id="failoverServers">
    <thead>
        <tr>
            <th class="row_selector_head"> <input type='checkbox' class='select_all_chkbx'/></th>
            <th><div>{% trans "IP ADDRESS" %}</div></th>
            <th><div>{% trans "VIRTUAL IP ADDRESS" %}</div></th>
            <th><div>{% trans "USERNAME" %}</div></th>
            <th><div></div></th>
        </tr>
    </thead>

    <tbody>
    {% for i in list %}
        <tr rel="{{ i.id }}">
            <td class="row_selector"><input type='checkbox'/></td>
            <td rel="ip">{{ i.ipAddress }}</td>
            <td rel="virtualIP">{{ i.virtualIpAddress }}</td>
            <td rel="username">{{ i.username }}</td>

        </tr>
    {% endfor %}

    </tbody>
</table>

如果我執行以下操作：

var list = "";
            $('#failoverServers td.row_selector.selected').each(function() {
            var row = $(this).closest('tr');
            var id = row.attr('rel');
            list += id + " ";           
        });

然后在第一個復選框列中有一個數字列表。

我想從表中獲取以下列表：

<td rel="ip">{{ i.ipAddress }}</td>

我為此使用什么jquery選擇器？

謝謝

Answer 1

嘗試這個：

var list = [];

$('#failoverServers td.row_selector.selected').each(function() {
    var row = $(this).closest('tr');
    list.push($(row).children("td[rel=ip]")[0].text());
});

Answer 2

感謝所有的評論。 我有以下工作：

 var list = [];
  $('#failoverServers td.row_selector.selected').each(function() {
        var row = $(this).closest('tr');
        var serverIp = row.find('td[rel=ip]').text();
        list += serverIp + " ";         
    });

我想做的就是從表中獲取所有ip項目，無論它們是已選擇還是現在（僅獲取全部）。我該怎么做？

Answer 3

這是您的工作示例（靜態，以便我可以測試）。 相應地放置模板占位符並更改標記（如果您希望符合標准格式）：表頭包含5個單元格，但行中的td僅4個，div不應放置在td s中-我的IDE尖叫:)這些“ rel”（為什么要使用它們）“ rels”應在鏈接中使用。 我認為“ id”和“ class”足以滿足您所需的一切（“ id”代表唯一的元素，“ class”代表您想要的任何數量）。

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script src="jquery181min.js" type="text/javascript"></script>
        <script>

        $(document).ready(function(){

        var values = '';    
            $('input:checkbox:checked.row_selector').parent().siblings(".ip").each(function() {
            values += '  ' + $(this).text();    
            });

        console.log(values);
        });    

        </script>
    </head>
    <body>

        <table class="display" style="width: 1000px;" id="failoverServers" border =1>
        <thead>
            <tr>
                <th class="row_selector_head"> <input type='checkbox' name="name" value="asdf" class='select_all_chkbx' checked="checked"/></th>
                <th>IP Address</th>
                <th>Virtual Ip Address</th>
                <th>Username</th>
            </tr>
        </thead>

        <tbody>
            <tr id="id1">
                <td><input class="row_selector" type='checkbox' name="name" value="val1" checked="checked" /></td>
                <td class="ip">123.123.123.123</td>
                <td class="virtualIP">55.55.55.55</td>
                <td class="username">Jean Valzean</td>
            </tr>
            <tr id="id2">
                <td><input class="row_selector" type='checkbox' name="name" value="val2"/></td>
                <td class="ip">125.125.125.124</td>
                <td class="virtualIP">22.22.22.22</td>
                <td class="username">Peter Meter</td>
            </tr>
                    <tr id="id3">
                <td><input class="row_selector" type='checkbox' name="name" value="val3" checked="checked" /></td>
                <td class="ip">192.168.33.24</td>
                <td class="virtualIP">33.33.33.33</td>
                <td class="username">Joe Schmoe</td>
            </tr>
        </tbody>
        </table>
    </body>
</html>

結果是： jQuery選擇td數據檢索結果

jQuery選擇器

問題描述

3 個解決方案

解決方案1
0 2013-02-05 18:50:09

解決方案2
0 2013-02-05 19:19:56

解決方案3
0 2013-02-06 09:22:08

jQuery選擇器

問題描述

3 個解決方案

解決方案1 0 2013-02-05 18:50:09

解決方案2 0 2013-02-05 19:19:56

解決方案3 0 2013-02-06 09:22:08

解決方案1
0 2013-02-05 18:50:09

解決方案2
0 2013-02-05 19:19:56

解決方案3
0 2013-02-06 09:22:08