更改附加tr的背景颜色



嘿,我在检查当前dateTime是否在start datetime和当前行的结束日期之间添加一些行,如果这是真的,我想更改背景行的颜色。

   $('#calendarTable').append(calendarRow);
   setCurrentLesson(field, calendarRow);
function setCurrentLesson(field, calendarRow){
  var currentDateTime = new Date();
  currentDateTime.setFullYear(field.tafel_datum.split("-")[0]);
  currentDateTime.setMonth(field.tafel_datum.split("-")[1]);
  currentDateTime.setMonth(currentDateTime.getMonth() -1); 
  currentDateTime.setDate(field.tafel_datum.split("-")[2]);
  //console.log(currentDateTime.setMonth(0)); -- Januar
  var startTime = field.tafel_von;
  var endTime = field.tafel_bis;
  var startDateTime =new Date(currentDateTime.getTime());
  startDateTime.setHours(startTime.split(":")[0]);
  startDateTime.setMinutes(startTime.split(":")[1]);
  startDateTime.setSeconds(startTime.split(":")[2]);
  endDateTime = new Date(currentDateTime.getTime());
  endDateTime.setHours(endTime.split(":")[0]);
  endDateTime.setMinutes(endTime.split(":")[1]);
  endDateTime.setSeconds(endTime.split(":")[2]);
  if(startDateTime < currentDateTime && endDateTime > currentDateTime){
** Change Background Color of the calendarRow**
     }
    }

您可以在setCurrentLesson()函数中编辑样式属性,因为您将其作为参数之一传递。

var index = $('#calendarTable').find(`tr`).length-1;
$('#calendarTable').find(`tr`).eq(index).attr('style','background-color:green;');

或者您也可以向其添加一类

var index = $('#calendarTable').find(`tr`).length-1;
$('#calendarTable').find('tr').eq(index).addClass('activeRow');

var index = $('#calendarTable').find(`tr`).length-1; $('#calendarTable').find(`tr`).eq(index).attr('style','background-color:green;');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="calendarTable" style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>

最新更新