如何使Tippy工具提示在表中工作

Question

我不能在表中使用tooltipster或tipy.js工具提示。这是一个包含技术数据和工作工具提示的神秘表格，这将是一个很大的帮助。下表工作正常，只是Tippy工具提示不显示任何内容，无论工具提示js放在哪里(td或input(。工具提示在页面其他地方的普通html中也能很好地工作。

我是不是运气不好，一直在使用浏览器标题分配

<div id = 'wrapper'></div>
items = "";
items += '<table>';
for (let i = 1; i <= 48; i++) {
items += '<tr>';
// ENTRANCE FEE 
items += `<td data-tippy-content = "EF">
<input maxlength = "2" id = "E${i}" /></td>`;
items += '</tr>';
}
items += '</table>';
document.getElementById("wrapper")innerHTML = items;

<script src="https://unpkg.com/@popperjs/core@2"></script>
<script src="https://unpkg.com/tippy.js@6"></script>
<script>tippy('[data-tippy-content]');</script>

Answer 1

innerHTML获得新值后，您需要再次调用tippy('[data-tippy-content]');。

var items = "";
items += '<table>';
for (let i = 1; i <= 4; i++) {
items += '<tr>';
// ENTRANCE FEE 
items += `<td data-tippy-content="EF" ><input maxlength="2" id="E${i}" /></td>`;
items += '</tr>';
}
items += '</table>';
document.getElementById("wrapper").innerHTML = items;

tippy('[data-tippy-content]');

<div id='wrapper'></div>
<script src="https://unpkg.com/@popperjs/core@2"></script>
<script src="https://unpkg.com/tippy.js@6"></script>
<script>
tippy('[data-tippy-content]');
</script>