無法更改使用jQuery

我有下面的代碼片段TD背景色：無法更改使用jQuery

function drawVisualization2(dataArray, divName) { 
    var dataTbl = google.visualization.arrayToDataTable(dataArray); 
    var table1 = new google.visualization.ChartWrapper({ 
     'chartType': 'Table', 
     'containerId': 'chart3', 
     dataTable: dataTbl, 
     'options': { 
      'width': '500px' 
     } 
    }); 
    table1.draw(); 

    function tableCleanUp() { 
     google.visualization.events.addListener(table1.getChart(), 'sort', tableCleanUp2); 
     tableCleanUp2(); 
    } 

    function tableCleanUp2() { 
     $('#chart3 .google-visualization-table-tr-odd, #chart3 .google-visualization-table-tr-even').each(function (e) { 
      $(this).closest('td:nth-child(1)').css("background-color", "red"); 
     }); 
    } 
    google.visualization.events.addListener(table1, 'ready', tableCleanUp); 
}

我無法改變TD的背景色。我的表看起來像這樣

<div id="chart3" style="position: relative;"> 
    <div style="position: relative;"> 
     <div style="position: relative; overflow: auto; width: 500px;"> 
      <table class="google-visualization-table-table" cellspacing="0"> 
       <tbody> 
        <tr class="google-visualization-table-tr-head"> 
        <tr class="google-visualization-table-tr-even"> 
        <tr class="google-visualization-table-tr-odd"> 
         <td class="google-visualization-table-td">SPINAL FUSION EXCEPT CERVICAL W/O MCC</td> 
         <td class="google-visualization-table-td">1804860128.00</td> 
         <td class="google-visualization-table-td">6130083182.00</td> 
         <td class="google-visualization-table-td">70.56</td> 
         <td class="google-visualization-table-td">29.44</td> 
        </tr> 
        <tr class="google-visualization-table-tr-even"> 
        <tr class="google-visualization-table-tr-odd"> 
       </tbody> 
      </table> 
     </div> 
    </div> 
</div>

來源

2014-01-21 noobie-php

我不認爲你可以使用'closest'和'第n-child'在一起「最接近」向上遍歷DOM樹。你想改變這些行中第一個「td」的背景顏色嗎？ –

是的，我正在嘗試改變第一個TD的顏色，並且我正在動態地創建DOM –

另外，你有一個'tr'類的「google-visualization-table-tr-head」。你應該看看使用'thead'元素。 –

嘗試用這種

$(this).find('td:nth-child(1)').css("background-color", "red");

來源

2014-01-21 12:23:07

是的，這是行得通的，我會將其標記爲真，因爲這是第一個爲我工作的答案 –

使用closest更換該

$(this).closest('td:nth-child(1)').css("background-color", "red");

你的是：

對於組中的每一個元素，得到第一個匹配的元素選擇器通過測試元素本身並遍歷其DOM樹中的祖先。

但沒有任何元素在與該選擇器的DOM上;您正在seaching子元素，從而使用find：

獲取每個元素的後代在當前組匹配元件，由一個選擇器，jQuery對象，或元件的過濾。

代碼：

$(this).find('td:nth-child(1)').css("background-color", "red");

演示：http://jsfiddle.net/IrvinDominin/YE5nr/

來源

2014-01-21 12:24:56

試試這個：

$('#chart3 .google-visualization-table-tr-odd > td:first-child, 
    #chart3 .google-visualization-table-tr-even > td:first-child') 
.css('background-color', 'red');

來源

2014-01-21 12:25:08

無法更改使用jQuery

回答

相關問題