使用第n個孩子，有

我需要有14 td中包含被選中的類添加到父td一個inputcheckbox一個tbody>tr一行。我相信我已經完成了這件事情，我可以得到一些幫助嗎？使用第n個孩子，有

JQUERY的Javascript表

var $table = $('#table-javascript').bootstrapTable({ 
    method: 'get', 
    url: 'bootstrap_database.php', 
    height: 3849, 
    cache: false, 
    striped: true, 
    pagination: true, 
    search: true, 
    pageSize: 100, 
    pageList: [100, 200, 600, 1000], 
    minimumCountColumns: 2, 
    clickToSelect: true, 
    columns: [{ 
     field: 'ID', 
     title: 'ID', 
     align: 'center', 
     visible: false 
    },{ 
     field: 'backlink', 
     title: 'Backlink', 
     align: 'left', 
     width: '20' 
    },{ 
     field: 'indexed', 
     title: 'PI', 
     align: 'center', 
     width: '20', 
    },{ 
     field: 'dindexed', 
     title: 'DI', 
     align: 'center', 
     width: '20', 
    },{ 
     field: 'moz', 
     title: 'MOZ', 
     align: 'center', 
     width: '20', 
    },{ 
     field: 'email', 
     title: 'EM', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'social', 
     title: 'SOC+', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'whois', 
     title: 'WHO', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'notes', 
     title: 'NT', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'removed', 
     title: 'RM', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'import_label', 
     title: 'SR', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'important', 
     title: 'IM', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'refresh', 
     title: 'RF', 
     align: 'center', 
     width: '20', 
     class: 'refreshstats' 
    },{ 
     field: 'exempt', 
     title: 'EX', 
     align: 'center', 
     width: '20', 
    },{ 
     field: 'spammy', 
     title: 'SP', 
     align: 'center', 
     width: '20', 
    }] 
});

JQUERY

if ($('tbody tr td:nth-child(14)').has('input:checkbox:checked')) { 
    $(this).parent('td').addClass('spammy_color'); 
}

之前HTML

<tbody class="searchable"> 
<tr> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" checked="checked" /></td> 
</tr> 
<tr> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" checked="checked" /></td> 
</tr> 
<tr> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" checked="checked" /></td> 
</tr> 
<tr> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" checked="checked" /></td> 
</tr> 
</tbody>

HTML後

<tbody class="searchable"> 
<tr> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td class="spammy_color"><input type="checkbox" checked="checked" /></td> 
</tr> 
<tr> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td class="spammy_color"><input type="checkbox" checked="checked" /></td> 
</tr> 
<tr> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td class="spammy_color"><input type="checkbox" checked="checked" /></td> 
</tr> 
<tr> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td><input type="checkbox" /></td> 
<td class="spammy_color"><input type="checkbox" checked="checked" /></td> 
</tr> 
</tbody>

來源

2015-05-19 Cesar Bielich

可以稍微減少到'$（代碼 'TBODY TR TD：第n個孩子（14）輸入[類型= 「複選框」]：勾選' ）'我認爲 –

做

if ($('.searchable td:nth-child(14):has(:checked)')) { 
    $(this).parent('td').addClass('spammy_color'); 
}

DEMO

來源

2015-05-19 19:13:25 AmmarCSE

似乎沒有工作，我編輯了我的HTML以匹配我所擁有的。 –

@CesarBielich，只是更新了我的小提琴。確保你有包裹在桌子裏的東西。讓我知道如果你需要更多的幫助 – AmmarCSE

當仍然不工作，它似乎與我的表動態生成 –

如果我理解正確的，你需要的是這樣的：

獲取選中的複選框
GE牛逼的父母
添加類

$('tr td:nth-child(14) :checked').parent().addClass('spm');

.spm { 
 
    background-color: green; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tbody class="searchable"> 
 
    <tr> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" checked="checked" /> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" checked="checked" /> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" /> 
 
     </td> 
 
     <td> 
 
     <input type="checkbox" checked="checked" /> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table>

UPDATE：我有點看向bootstrapTable插件，記錯你位，且選擇衝去。
反正在examples page你可以用CellStyle

使用cellStyle列選項來設置自舉表的單元格樣式發現樣品

和你cellStyle功能應該像

function cellstyle(value, row, index){ 
    if(value){ 
     return { 
      classes: "spammy_color" 
     }; 
    } 
    return {}; 
}

來源

2015-05-19 19:42:58 Grundy

確定您的示例適用於我的JSFIDDLE http://jsfiddle.net/j490azj8/1/但由於某種原因沒有在我的網站上工作。我不得不補充說，我很抱歉，我沒有認爲這個表是通過JavaScript動態生成的，所以我有一個感覺是問題 –

@CesarBielich，所以提供你有什麼，我們可以幫助你 – Grundy

我已經添加了我的JS也生成表的代碼。該HTML正是它生成後的樣子 –

我終於找到了我的答案。問題是，當試圖將樣式和類似的東西應用到動態生成的表（如datatable或bootstrapTable）時，您必須等待數據完全加載完畢，否則將無法通過jquery應用樣式。

我的作品

$table.on('load-success.bs.table', function() { 
    $('tr td:nth-child(14) :checked').parent().addClass('spammy_color'); 
});

bootstrapTable Events Documentation

來源

2015-05-19 21:34:24

使用第n個孩子，有

回答

相關問題