Javascript 隐藏表行未显示正确的信息

我对Javascript有一些问题。我有一个表格，显示了员工根据客户名称进行搜索时客户的基本信息。当员工单击“查看销售历史记录”时，将显示特定客户销售历史记录的隐藏表行

当我将css显示更改为“表行”时，显示搜索返回的所有客户的销售历史记录没有问题。但是，每当我隐藏表行并包含javascript以显示隐藏行时，它只会显示第一个客户的销售历史记录

到目前为止，我一直在尝试这样做，希望有人能在这里帮助我

while($row = mysql_fetch_assoc($result)) {
     $id = $row["id"];
     $cfname = $row["f_name"];
     $clname = $row["l_name"];
     $cemail = $row["email"];
     $ccompany = $row["company_name"];
     $year = $row["year"];
     $product = $row["product"];
     $employee = $row["employee"];
     $status = $row["status"];
     echo '<tr>
            <td>'.$cfname.' '.$clname.'</td>
            <td>'.$cemail.'</td>    
            <td>'.$ccompany.'</td>      
            <td> <h4 id="vsalesHistory" onclick="vsalesHistory()">View Sales History</h4></td>
            </tr>';

     echo '<thead id="salesHistoryHead">
            <tr>
             <th>Date of Sales</th>
             <th>Type of Product</th>
             <th>Previous Sales Manager</th>
             <th>Job Status</th>
            </tr>
            </thead>';
    echo '<tr id="salesHistory">
            <td>'.$year.'</td>
            <td>'.$product.'</td>
            <td>'.$employee.'</td>
            <td>'.$status.'</td>
        </tr>';

}
echo '</table>';

---

您正在创建具有相同ID的多行，这不是一个好主意。相反，请使用行ID创建唯一的ID，如：

echo '<thead id="salesHistoryHead' . $id . '">
        <tr>
         <th>Date of Sales</th>
         <th>Type of Product</th>
         <th>Previous Sales Manager</th>
         <th>Job Status</th>
        </tr>
        </thead>';
echo '<tr id="salesHistory' . $id . '">
        <td>'.$year.'</td>
        <td>'.$product.'</td>
        <td>'.$employee.'</td>
        <td>'.$status.'</td>
    </tr>';

---

@非常感谢你！！我不知道我们可以这样分配一个唯一的id标签。今天学到了一些新东西。

echo '<thead id="salesHistoryHead' . $id . '">
        <tr>
         <th>Date of Sales</th>
         <th>Type of Product</th>
         <th>Previous Sales Manager</th>
         <th>Job Status</th>
        </tr>
        </thead>';
echo '<tr id="salesHistory' . $id . '">
        <td>'.$year.'</td>
        <td>'.$product.'</td>
        <td>'.$employee.'</td>
        <td>'.$status.'</td>
    </tr>';

        <td> <h4 id="vsalesHistory" onclick="vsalesHistory(' . $id . ')">View Sales History</h4></td>

function vsalesHistory(id){
    var e = document.getElementById('salesHistoryHead'+id);
    var f = document.getElementById('salesHistory'+id);
    ...