單擊按鈕時從td獲取值。

這是我JSP代碼的一部分：單擊按鈕時從td獲取值。

<tr style="background-color: #F0F0F0; "> 
     <td class="leavehistory" style="width: 6%; padding: 7px;"><%=i++%></td> 
     <td id="leaveID" class="leavehistory" style="width: 9%;"><%=rs.getString(7)%></td> 
     <td class="leavehistory" style="width: 12%;"><%=rs.getTimestamp(1)%></td> 
     <td class="leavehistory" style="width: 10%;"><%=rs.getInt(2)%> days</td> 
     <td class="leavehistory" style="width: 15%;"><%=rs.getString(3)%> - <%=rs.getString(4)%></td> 
     <td class="leavehistory" style="width: 15%;"><%=rs.getString(5)%></td> 
     <td style="width: 30%;"><select> 
        <option value="0">Pending</option> 
        <option value="1">Cancel</option> 
      </select> <input class="button" type="button" name="bttn" onClick="cancelSub();"value="View"/><input class="button" type="button" name="bttnDelete" onClick="cancelSub();"value="Change"/></td> 
    </tr> 
<% } %>

這是2行所生成的HTML輸出如何看起來像：

<tr style="background-color: #F0F0F0; "> 
    <td class="leavehistory" style="width: 6%; padding: 7px;">1</td> 
    <td id="leaveID" class="leavehistory" style="width: 9%;">LE000002</td> 
    <td class="leavehistory" style="width: 12%;">2012-01-17 19:31:18.0</td> 
    <td class="leavehistory" style="width: 10%;">2 days</td> 
    <td class="leavehistory" style="width: 15%;">18/01/2012 - 19/01/2012</td> 
    <td class="leavehistory" style="width: 15%;">Sick</td> 
    <td style="width: 30%;"><select> 
       <option value="0">Pending</option> 
       <option value="1">Cancel</option> 
     </select> <input class="button" type="button" name="bttn" onClick="cancelSub();"value="View"/><input class="button" type="button" name="bttnDelete" onClick="cancelSub();"value="Change"/></td> 
</tr> 


<tr style="background-color: #F0F0F0; "> 
    <td class="leavehistory" style="width: 6%; padding: 7px;">2</td> 
    <td id="leaveID" class="leavehistory" style="width: 9%;">LE000003</td> 
    <td class="leavehistory" style="width: 12%;">2012-01-18 03:04:15.0</td> 
    <td class="leavehistory" style="width: 10%;">1 days</td> 
    <td class="leavehistory" style="width: 15%;">19/01/2012 - 20/01/2012</td> 
    <td class="leavehistory" style="width: 15%;">Sick</td> 
    <td style="width: 30%;"><select> 
       <option value="0">Pending</option> 
       <option value="1">Cancel</option> 
     </select> <input class="button" type="button" name="bttn" onClick="cancelSub();"value="View"/><input class="button" type="button" name="bttnDelete" onClick="cancelSub();"value="Change"/></td> 
</tr>

這些2行的數據被從數據庫中檢索。對於每一行有一個查看和更改按鈕。如果我點擊LE000001行的Change按鈕，那麼我將得到值 - 「LE000001」。然後我可以使用該值更新離職記錄的狀態。

如果我點擊LE000002行的更改按鈕，那麼我會得到值 - 「LE000002」。由於只顯示2行。

如果數據庫有更多的記錄，它可以儘可能多。有什麼方法可以獲得價值？

來源

2012-01-17 crchin

你可以重新格式化標記以獲得更好的可讀性嗎？（我們中的一些人沒有很多時間閱讀大量的噪音來回答您的問題）使用代碼註釋來突出顯示您的問題區域。另外我注意到那裏有三個TD元素，並且有相同的「leaveID」ID是故意的？如果是這樣，那將是無效的HTML，並且您將無法通過使用javaScript的ID訪問該元素。 – 7wp 2012-01-17 19:10:03

如果可能通過獲取按鈕的父母點擊（父div的id），然後，找到id爲'leaveId'的元素，並獲取該元素的值（.val（）），使用jQuery？ – 2012-01-17 19:16:42

您似乎專注於JS-only解決方案。我只是想警告您，您需要確保您的網站在客戶端禁用JavaScript的情況下同樣適用。 – BalusC 2012-01-17 19:41:58

首先，您的HTML無效，因爲您有幾個元素具有相同的leaveID ID。

現在回答你的問題，你爲什麼不乾脆讓你的JS函數需要行的ID作爲參數：

onClick="cancelSub('LE000001');"

，從而生成它：

onClick="cancelSub('<%= rs.getString(7) %>');"

那說，使用scriptlets和從JSP訪問JDBC結果集顯示缺乏適當的MVC體系結構。閱讀How to avoid Java code in JSP files?

來源

2012-01-17 19:13:38

是的，你已經解決了我的問題！萬分感謝。我將嘗試將我的代碼更改爲MVC體系結構。 :) – crchin 2012-01-17 19:45:34

單擊按鈕時從td獲取值。

回答

相關問題