我已经尝试了所有我能想到并找到的方法,但没有任何效果。即使是 ChatGPT 的答案也不起作用。
我正在使用 Datatables.js 并且我正在自定义
excel
导出按钮功能,以便我可以创建一个超链接,其中单元格中的文本是一个 URL。
所以我:
<Relationship>
标签并添加必要的属性指向cell<Relationship>
标签注入<Relationships>
文档然后我:
<hyperlink>
元素<Relationship>
标签<hyperlink>
标签附加到单元格的<c>
标签最后,单元格的语法如下所示:
<c t="inlineString" r="E54">
<is>
<hyperlink r:id="rId3" xmlns="http://schemas.openxmlformats.org/spreadsheetml/2006/main" xmlns:r="http://schemas.openxmlformats.org/officeDocument/2006/relationships">
<t>Click here</t>
</hyperlink>
</is>
</c>
关系语法如下所示:
<Relationship Id="rId3" Target="https://google.com" TargetMode="External" xmlns="http://schemas.openxmlformats.org/package/2006/relationships" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/hyperlink"></Relationship>
代码:
const options = {
dom: 'B',
paging: false,
searching: false,
buttons: [
{ extend: 'excel', title: 'Survey Reports', className: 'btn-sm', text: 'Export to excel',
customize: function(xlsx, button, dt, config) {
// Get the sheet data for the first sheet in the .xlsx file
const sheet = xlsx.xl.worksheets['sheet1.xml']
const relationships = xlsx.xl._rels['workbook.xml.rels'].querySelector('Relationships')
const rows = sheet.querySelectorAll('row')
// Adding an attribute to the worksheetElem element
const worksheetElem = sheet.querySelector('worksheet')
worksheetElem.setAttribute('xmlns:xhtml', 'http://www.w3.org/1999/xhtml')
// Loop through each row
rows.forEach((row, rowIndex) => {
// Get all cells in the row
const rowCells = row.querySelectorAll('c')
// Loop through cells
rowCells.forEach(cell => {
// Counting the relationships to give the correct number to the rel ID
let relsAmount = relationships.children.length
relsAmount++
// Get the <is> tag inside the cell
const cellInnerElem = cell.querySelector('is')
// Create the relationship element
const relElem = `<Relationship Id="rId${relsAmount}" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/hyperlink" Target="https://google.com" TargetMode="External"></Relationship>`
// Add the relationship element into the relationships doc
relationships.insertAdjacentHTML('beforeend', relElem)
// Remove the <t> tag from the cell
cellInnerElem.querySelector('t').remove()
// Update the cell to include the hyperlink with a new <t> tag
const link = `<hyperlink r:id="rId${relsAmount}"><t>Click here</t></hyperlink>`
cellInnerElem.insertAdjacentHTML('beforeend', link)
})
})
}
}
]
}
let table = $('table').DataTable(options);
<link href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css" rel="stylesheet"></link>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.3.1/js/dataTables.buttons.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.3.1/js/buttons.html5.min.js"></script>
<table id="">
<thead>
<tr>
<th>Heading</th>
<th>Heading</th>
</tr>
</thead>
<tbody>
<tr>
<td>Some data</td>
<td>Some data</td>
</tr>
<tr>
<td>Some data</td>
<td>Some data</td>
</tr>
</tbody>
</table>
任何帮助将不胜感激。