已解決430363個問題，去搜搜看，總會有你想問的

如何使用javascript在動態表格中獲取單擊單元格的內容

首頁猿問如何使用javascript在動態...

如何使用javascript在動態表格中獲取單擊單元格的內容

JavaScript

鴻蒙傳說 2022-07-01 16:45:56

我有桌子。現在，如果我單擊下面的任何表名稱，例如反饋，我如何獲取它們的值。表是動態的。下面是顯示表名的代碼。<table class="table table-hover" style="margin-top: 25px;width:300px;"> <thead> {% for i in tables %} <tr> <th > {{ i }} </th> </tr> {% endfor %} </thead></table>注意，i是表名的值。在這里，我想添加兩件事：點擊監聽器通過使用 JavaScript 單擊表格來獲取值

查看完整描述

1 回答

智慧大石

TA貢獻1946條經驗獲得超3個贊

要讓元素被點擊，你可以監聽表格上的點擊事件，然后使用event.target屬性來獲取被點擊的元素。

// set up the 'click' event listener

myTable.addEventListener('click', event => {

const clickedElement = event.target;

// now that you have the clicked element, do what you want with it

let stuffIWant = clickedElement.<some method or property of element>;

});

從問題中的示例來看，您似乎在尋找元素的內容<th>。如果是這種情況，您可以使用：

stuffIWant = clickedElement.innerText;

一個工作示例：

// listen for all 'click' events within table

const tbl = document.getElementById('tbl');

tbl.addEventListener('click', event => {

const el = event.target;

alert(`you clicked "${el.innerText}"`);

});

#tbl {

background-color: #aaa;

margin: 12px;

}

th {

padding: 0.5rem 2rem;

border: 1px solid #999;

}

/* change cursor to hand on hover */

th:hover {

cursor: pointer;

}

<thead>

<tr><th>Feedback</th></tr>

<tr><th>Complaint</th></tr>

<tr><th>Praise</th></tr>

</thead>

</table>

反對回復 2022-07-01

1 回答
0 關注
388 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何使用javascript在動態表格中獲取單擊單元格的內容

如何使用javascript在動態表格中獲取單擊單元格的內容

1 回答

添加回答