Question

请在jsfiddle上查看我的代码，因为我似乎无法弄清楚如何在这里发布。在＆＃34;点击以赢得赢家＆＃34;按下按钮，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>

A.B.50.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

Answer 1

$(".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);
});

Answer 2

添加此代码以突出显示名称

Old situation:        New siuation:
audit-module           audit-module
|- src                |- persistence
|- target             |  |- src
|- pom.xml            |  |- target
                      |  |- pom.xml
                      |- service
                      |  |- src
                      |  |- target
                      |  |- pom.xml
                      |- web
                      |  |- src
                      |  |- target
                      |  |- pom.xml
                      |- pom.xml

Answer 3

您好，只需将其添加到您的脚本中：

$(".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');
    }
}

突出显示第一列中的单元格以获得/赢得突出显示的单元格

3 个答案: