突出顯示第一列的結果/獲勝突出顯示的單元格中的單元格

-4

請在jsfiddle上查看我的代碼，因爲我似乎無法弄清楚如何在此處發佈。按下「點擊繪製贏家」按鈕後，10秒鐘後，確定獲勝者。但是，只有獲獎者選票號碼突出顯示。突出顯示第一列的結果/獲勝突出顯示的單元格中的單元格

需要添加什麼才能突出顯示相應的獲勝選票名稱？

https://jsfiddle.net/Nick_Chand/tymv6m03/

<div class="container">

<table style="width: 100%; height: 100%; margin-left: auto; margin-right: auto;"> 
    <tbody> 
    <tr> 
     <td style="width: 50%; text-align: center; vertical-align: middle;" rowspan="2"> 
     <button class="choosewinner" style="text-align: center; font-weight: bold; font-size: 18px;">Click to Draw a Winner</button> 
     </td> 
     <td align="center;" style="text-align: center; font-size: 16px; font-weight: bold;">WIN A PRIZE OF $</td> 
    </tr> 
    <tr> 
     <td style="width: 50%; text-align: center; font-weight: bold; color: #E63946">Qualifying Reps - Prize Number 1</td> 
    </tr> 
    </tbody> 
</table> 

<table id="table_id" class="table text-center"> 


    <tbody class="row" style="font-size: 12px; "> 

    <table class="tableizer-table" > 
     <thead> 
     <tr class="tableizer-firstrow"> 
      <th style="text-align: center;">_______Rep_______</th> 
      <th style="text-align: center;">_Ballots_</th> 
      <th style="text-align: center;">_Probability_</th> 
      <th style="text-align: center;">1</th> 
      <th style="text-align: center;">2</th> 
      <th style="text-align: center;">3</th> 
      <th style="text-align: center;">4</th> 
      <th style="text-align: center;">5</th> 
      <th style="text-align: center;">6</th> 
      <th style="text-align: center;">7</th> 
      <th style="text-align: center;">8</th> 
      <th style="text-align: center;">9</th> 
      <th style="text-align: center;">10</th> 
     </tr> 
     </thead> 
     <tbody align=center>

AB50.26％1 2 3 4 5 D.K60.31％1 2 3 4 5 6 T.R90.47％1 2 3 4 5 6 7 8 9 G.J30.16％1 2 3

來源

2017-01-10 Nick Chand

做標記，如果它的工作對你的答案是正確的。 – Abhinav

$(".choosewinner").click(function() { 
    //highlight(); 
    var startTime = new Date().getTime(); 
    var interval = setInterval(function() { 
    if (new Date().getTime() - startTime > 10000) { 
     clearInterval(interval); 
     $('.highlight').addClass('youwin'); 
     **$('.highlight').parent().children(':first-child').addClass('youwin');** 
     return; 
    } 
    highlight(); 
    }, 200); 
});

來源

2017-01-10 10:58:46 Abhinav

非常感謝你。它做到了。 –

@NickChand你能否接受它作爲正確答案呢？ – Abhinav

添加該代碼突出名稱

$('.highlight').addClass('youwin').parent().find('td:first-child').addClass('youwin');

來源

2017-01-10 11:06:53

嗨只需添加到您的腳本：

$(".choosewinner").click(function() { 
    //highlight(); 
    var startTime = new Date().getTime(); 
    var interval = setInterval(function() { 
    if (new Date().getTime() - startTime > 2000) { 
     clearInterval(interval); 
     $('.highlight').addClass('youwin'); 

      HilightWinner($('.highlight')); // NEW LINE 

      return; 
    } 
    highlight(); 
    }, 200); 
}); 

// NEW FUNCITON 
function HilightWinner(myDiv){ 
    if(myDiv){ 
     var td = $('td:first', myDiv.parents('tr')); 
     td.addClass('youwin'); 
    } 
}

來源

2017-01-10 11:10:33 Federico

突出顯示第一列的結果/獲勝突出顯示的單元格中的單元格

回答

相關問題