[英]How to get the Dynamic Table cell value on button click
我有一個動態生成的表。 在其行中,我放置按鈕。
for (var i = 0; i < resp.length; i++) {
tr = tr + "<tr>";
tr = tr + "<td >" + resp[i].Date + "</td>";
tr = tr + "<td >" + resp[i].age + "</td>";
tr = tr + "<td >" + resp[i].Hour + "</td>";
tr = tr + "<td><input value='get me' type='button' class='theButton' id='ma' onclick='test()'></td>";
tr = tr + "</tr>";
};
單擊按鈕后,我想獲取該行的特定單元格值。 例如:如果我點擊第一行的年齡,那么我必須得到的值是50。如果我點擊第二行的按鈕,那么我應該得到94。
單擊按鈕如何獲取表格單元格的值?
這是您的動態表解決方案:
<script language="javascript">
var tbl = document.getElementById("tblId");
if (tbl != null) {
for (var i = 0; i < tbl.rows.length; i++) {
for (var j = 0; j < tbl.rows[i].cells.length; j++)
tbl.rows[i].cells[j].onclick = function () { getval(this); };
}
}
function getval(cel) {
alert(cel.innerHTML);
}
</script>
因此,通過使用此javascript,您可以獲得任何表格單元的值。
這是您的解決方案:
$(document).find('.theButton').on('click',function(){
var age = $(this).parents('tr:first').find('td:eq(1)').text();
console.log(age);
});
您可以將年齡傳遞給按鈕onclick函數,例如onclick='test('"+resp[i].age +"')'
for (var i = 0; i < resp.length; i++) {
tr = tr + "<tr>";
tr = tr + "<td >" + resp[i].Date + "</td>";
tr = tr + "<td >" + resp[i].age + "</td>";
tr = tr + "<td >" + resp[i].Hour + "</td>";
tr = tr + "<td><input value='get me' type='button' class='theButton' id='ma' onclick='test("+resp[i].age +")'></td>";
tr = tr + "</tr>";
};
用jQuery嘗試這個例子,我用rowid替換了功能測試
https://jsfiddle.net/ucostea/2thyj0ft/
$(document).on("click", ".theButton", function(){
alert("Aage: "+$('.age_'+$(this).attr('rownr')+'').text());
});
for (var i = 0; i < 10; i++) {
var tr = "";
tr = tr + "<tr >";
tr = tr + "<td class='date_"+i+"'>Date" + i + "</td>";
tr = tr + "<td class='age_"+i+"'>Age " + i + "</td>";
tr = tr + "<td class='hour_"+i+"'>Hour " + i + "</td>";
tr = tr + "<td><input value='get me' type='button' class='theButton' id='ma' rownr='" + i + "'></td>";
tr = tr + "</tr>";
$('.table tbody').append(tr);
};
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.