JQuery PHP獨特的ID爲每個HTML表格的行

我剛剛學習JQuery，我被困在以下。JQuery PHP獨特的ID爲每個HTML表格的行

我有一個HTML表（由PHP創建，顯示MYSQL查詢的結果）。

該表的第一列有一個下拉菜單，允許用戶更改單元格的值並更新數據庫。我正在使用，.toggle，.post到使這項工作。我的問題是，只有第一行工作，我相信是因爲我的目標是重複的身份證。

那麼，有人可以指點我正確的技術。最大的問題是不知道要問的正確問題....

我是否以某種方式動態地爲每一行創建唯一的ID？但是如果是這樣的話，我該如何傳遞這些信息呢，或者讓JQuery去定位每一行，並且它的內容是由用戶選擇的？

感謝

來源

2013-03-18 elong

你能分享你正在嘗試的代碼嗎？如果通過Id表示HTML標識，則這些應該是每頁一個，所以您可能想要使用類。 – 2013-03-18 14:50:42

是的，不允許在HTML文檔中多次設置一個ID（這非常重要）。 – Eich 2013-03-18 14:51:12

倒不如簡單地使用類。將id="替換爲class="，然後根據所點擊的行而不是id來定位目標。

var theRow = $(this).closest("tr.myclass"); 
theRow.doSomething();

來源

2013-03-18 14:50:31

謝謝，這似乎工作。我需要一點時間來真正理解和實施它......但知道我知道要走的方向。再次感謝。 – elong 2013-03-18 15:10:31

不要從ID的角度來看待它。從樹的POV看它。 DOM樹中的每個節點都知道它在哪裏：它的父母，它的兄弟姐妹，它的孩子。如果連續發生某些事情，您可以使用點擊的位置來標識「您在哪裏」，並以這種方式獲取必要的相關數據。

例如

<tr> 
    <td>Row 1</td> 
    <td><button click="showRowNumber(this);">click</button></td> 
</tr> 
<tr> 
    <td>Row 2</td> 
    <td><button click="showRowNumber(this);">click</button></td> 
</tr> 
<script type="text/javascript"> 
function showRowNumber(el) { 
    alert($(el).prev().text()); // outputs "Row 1" or "Row 2" 
} 
</script>

沒有ID，只是一些樹操作代碼。

來源

2013-03-18 14:54:52

正如凱文說，你需要使用類而不是一個ID。

在類的事件處理程序，在這種情況下click，使用this，這樣你具體指的是點擊的元素，像這樣：

$('.toggler').click(function(){ 

    $(this).append('clicked element id: '+this.id); //will show the unique id for the toggled element 
    //$.post(); will want to put your $.post inside to also make use of "this" 
});

爲了幫助你瞭解你也可以做此上byTagName，在這種情況下，由表格單元格（td）：

$('td').click(function(){ 

    $(this).append('clicked element id: '+this.id); //will show the unique id for the toggled element 
    //$.post(); will want to put your $.post inside to also make use of "this" 
});

this的更多用途：如果您要刪除或添加行到您的表中，並且需要跟蹤您正在處理的行，那麼您可以使用jQuery或純粹的javascript內部click事件，如下所示：以顯示哪些數字行，你點擊：

$("table tr").click(function(){ 
    alert('jQuery: '+$(this).index()); //jQuery 
    alert('javascript: '+this.rowIndex); //javascript 
});

最後，如果當你需要使用jQuery的on()方法使用事件委派頁面加載不存在的行。這也可能是您不能單擊除第一行之外的其他行的原因。

$(document.body).on('click', "table tr", function(){ 
    alert('jQuery: '+$(this).index()); //jQuery 
    alert('javascript: '+this.rowIndex); //javascript 
});

來源

2013-03-18 14:54:59

謝謝，這也有幫助 – elong 2013-03-18 15:11:20

JQuery PHP獨特的ID爲每個HTML表格的行

回答

相關問題