ブートストラップテーブルの選択行の背景色を上書きする

Question

jQueryブートストラップテーブルプラグインを使用しています。選択した行の色を変更し、次の行をクリックすると元の色に復元する必要があります。このフィドルhttp://jsfiddle.net/haideraliarain/e3nk137y/789/はこれを行う方法を説明しています。しかし、私はデフォルトの緑の代わりに私の選択の色のハイライトを持っていたいと思います。私は色を変更する以下のコードを使用してこれを試しましたが、問題は選択された行の色が次のクリック時に変更され、直ちに変更されないことです。ここで私のフィドルですhttps://jsfiddle.net/amotha/1yvr1kun/2/ 現在のクリックで変更を行うにはどうしたらいいですか？

HTML：

<table id="table" data-toggle="table" 
     data-url="/gh/get/response.json/wenzhixin/bootstrap-table/tree/master/docs/data/data1/" 
     data-click-to-select="true" 
     data-single-select="true"> 
    <thead> 
    <tr> 
     <th data-field="state" data-checkbox="true" data-visible="false"></th> 
     <th data-field="name">Name</th> 
     <th data-field="stargazers_count">Stars</th> 
     <th data-field="forks_count">Forks</th> 
     <th data-field="description">Description</th> 
    </tr> 
    </thead> 
</table> 

JS：

$('#table').on('click-row.bs.table', function (e, row, $element) { 
     $('.success').removeClass('success'); 
     $('.success').css("background-color","#fff"); 
     $($element).addClass('success'); 
     $('.success').css("background-color","#00FFFF"); 
}); 

Answer 1

は、私が選択したテーブルの背景のCSSを作成したCSSの一部に

.success td 
{ 
    background-color:red !important; 
} 

Answer 2

をしたい色を変更jsfiddle行わのような色：

<style> 
.tblcss{ 
    background-color: red /* You can use any color of you choice here */ 
} 
</style> 

し、それを使用します。

$('#table').on('click-row.bs.table', function (e, row, $element) { 
     $('.success').removeClass('tblcss'); 
     $($element).addClass('tblcss'); 
}); 

が更新Fiddle

Answer 3

を確認CSSでのカスタムクラスを追加します。

tr.custom--success td { 
    background-color: #000000; /*custom color here add !important if you don't want the hover color*/ 
} 

を次に、あなたのJavascriptを：

$('#table').on('click-row.bs.table', function (e, row, $element) { 
    $('.custom--success').removeClass('custom--success'); 
    $($element).addClass('custom--success'); 
}); 

JSFiddle：https://jsfiddle.net/8kguL1ow/1/

これは必要なものを提供するはずです。

不明な点がある場合は、質問してください。次に、何が起こっているのか、もう少し詳しく説明します。

Answer 4

このJsfiddle

$('#table').on('click-row.bs.table', function (e, row, $element) { 
    $($element).siblings().removeClass('success');  
    $($element).addClass('success'); 

    });