Jquery添加類到錶行只適用於第一行

我想使用jquery添加一個類到錶行元素，但它只適用於第一行。我使用mysql數據庫填充表格，並使用而循環顯示錶格。Jquery添加類到錶行只適用於第一行

按下按鈕後，我希望每一行在盤旋時改變顏色。我想應用到錶行元素類：

.hoverChange:hover 
{ 

    background-color: #66ccff 

}

表和while循環，顯示所有的數據：

   <table border = 1> 
       <tr> 
       <th> ID </th> 
       <th> Name </th> 
       <th> Description </th> 
       <th> Type </th> 
       <th> Price </th> 
       <th> Cost Price </th> 
       <th> Stock Level </th> 
       <th> EAN </th> 
       </tr> 

       <?php 

       while ($product_Info = mysqli_fetch_array($result,MYSQLI_ASSOC)) { 


         ?> 

         <tr id = tableRows> 

         <?php 
         echo "<td>" . $product_Info["product_ID"] . "</td>"; 
         echo "<td>" . $product_Info["product_Name"] . "</td>"; 
         echo "<td>" . $product_Info["product_Desc"] . "</td>"; 
         echo "<td>" . $product_Info["product_Type"] . "</td>"; 
         echo "<td>" . $product_Info["product_Price"] . "</td>"; 
         echo "<td>" . $product_Info["product_Cost"] . "</td>"; 
         echo "<td>" . $product_Info["product_Stock"] . "</td>"; 
         echo "<td>" . $product_Info["product_ean"] . "</td>">       


         echo "<tr>"; 

       } 

       echo "</table>";

按鈕：

<button type="button" id = "updateBtn" class="btn btn-info">Update</button>

最後jQuery的我正在使用：

$(document).ready(function(){ 
$("#updateBtn").click(function(){ 
    $('#tableRows').addClass('hoverChange'); 
}); 
});

來源

2016-12-05 lp-pixel

@JayBlanchard哦，對，完全監督。反正你的答案解釋這裏有什麼不對 – empiric

謝謝@JayBlanchard，現在工作正常。 –

如果答案解決了您的問題，請考慮接受答案。以下是http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work然後返回到此處，並使用勾號/複選標記執行相同操作，直至變爲綠色。這告知社區，找到了解決方案。否則，其他人可能會認爲這個問題仍然存在，並且可能需要發佈（更多）答案。您將獲得積分，其他人將被鼓勵幫助您。 *歡迎使用Stack！* –

您需要爲表格行使用類而不是ID。 ID's Must Be Unique，具體是因爲當您嘗試與這些元素交互時，它會在JavaScript和CSS中導致問題。

你有一些流浪的空間，你沒有引用屬性。這也可能成爲未來的問題，即

<tr class="myClass">

來源

2016-12-05 17:44:48

您應該重複使用的對象，而不是class屬性id的。 ID在整個頁面中應該是唯一的。

並注意您的代碼中的空格;）

來源

2016-12-05 17:45:16

Jquery添加類到錶行只適用於第一行

回答

相關問題