2017-10-14 70 views
1

我试过一些解决方案,但它仍然不起作用。 我想使用jQuery DataTables插件在表中显示数据库中的数据。 技术上一切正常,但某些行的背景颜色不起作用。 有什么问题?DataTables jQuery中,在CSS中的背景颜色不起作用

<html lang="pl"> 
<head> 
    <meta charset="utf-8" /> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> 
    <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.16/css/jquery.dataTables.css"> 

    <title>Football stats</title> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.16/js/jquery.dataTables.js"></script> 
    <script> 
     $(document).ready(function(){ 
      $('#table1').DataTable(); 
     }); 
    </script> 
</head> 
<?php 
$polaczenie = new mysqli('localhost','root','','mecze'); 
$sql = 'MY SELECT'; 
$wynik = $polaczenie->query($sql); 

echo '<body> 
<table id="table1"> 
<thead> 
<tr> 
<th>ID</th> 
<th>Hour</th> 
<th>Country</th> 
<th>Team</th> 
<th>Ov 2,5</th> 
<th>Avg</th> 
<th>Ov 1,5ht</th> 
<th>LG HT</th> 
<th>LG FT</th> 
<th>LG</th> 
<th>EOver</th> 
<th>EAvg</th> 
<th>EOvHT</th> 
<th>EHt</th> 
<th>EFt</th> 
<th>ELate</th> 
<th>SUMAvg</th> 
<th>H2HOver</th> 
<th>H2HGAvg</th> 
<th>H2HOvHt</th> 
</tr> 
</thead>'; 

echo '<tbody>'; 
while (($rekord=$wynik -> fetch_assoc()) != null) 
{ 
    $explode = explode("/", $rekord['home']); 
    echo '<tr>'; 
    echo '<td>'.$rekord['id_match'] . '</td>'; 
    echo '<td>'.$rekord['hour'] . '</td>'; 
    echo '<td>'.$explode[2] . '</td>'; 
    echo '<td>'.$explode[3] . '</td>'; 
    echo '<td>'.$rekord['over'] . '</td>'; 
    echo '<td>'.$rekord['goalsavg'] . '</td>'; 
    echo '<td>'.$rekord['overht'] . '</td>'; 
    echo '<td>'.$rekord['lategoalht'] . '</td>'; 
    echo '<td>'.$rekord['lategoalft'] . '</td>'; 
    echo '<td>'.$rekord['lategoal'] . '</td>'; 
    echo '<td>'.$rekord['EOver'] . '</td>'; 
    echo '<td>'.$rekord['EAvg'] . '</td>'; 
    echo '<td>'.$rekord['EOvHT'] . '</td>'; 
    echo '<td>'.$rekord['EHt'] . '</td>'; 
    echo '<td>'.$rekord['EFt'] . '</td>'; 
    echo '<td>'.$rekord['ELate'] . '</td>'; 
    echo '<td>'.$rekord['SUMAvg'] . '</td>'; 
    echo '<td>'.$rekord['H2HOver'] . '</td>'; 
    echo '<td>'.$rekord['H2HGAvg'] . '</td>'; 
    echo '<td>'.$rekord['H2HOvHt'] . '</td>'; 
    echo '</tr>'; 
} 
echo '</tbody>'; 
echo '</table>'; 
?> 

有应该如何看起来像:https://datatables.net/examples/basic_init/zero_configuration.html

我行没有白标明..

+1

请删除不会在浏览器中运行的服务器端代码,并提供一个演示问题的[mcve] – charlietfl

+2

用足够的原始html创建表,您可以将它全部放入[stack snippet](https:// stackoverflow .blog/2014/09/16/introduction-runnable-javascript-css-and-html-code-snippets /)并在此页面中正确运行 – charlietfl

+0

更好地给一个JSFiddle。最快得到答案。或者你也可能想要标记php标签? –

回答

0
<table id="table1" class="stripe" cellspacing="0" width="100%"> 
here

。如果你想悬停式样,你可能不得不提供一些JavaScript。详细了解造型here

0

class="display"添加到您的表格。例如:

<table id="table1" class="display" width="100%" cellspacing="0"> 

请参阅styling classes了解更多信息。