下面是点击“打开窗口”时弹出窗口的 html 代码。我添加了下载按钮(在其中)。一旦用户单击它,就应该下载该表。我在这里缺少一些东西。谁能帮我?
我已经快到最后阶段了。唯一悬而未决的是下载内容
<table border=1>
<tr>
<th> </th>
<th> sub_domain </th>
<th> nReviews </th>
<th> Ratings_e </th>
<th> Text_e </th>
<th> rn </th>
<th> launcher_html </th>
</tr>
<tr>
<td align=\"right\"> 1 </td>
<td> a1 </td> <td align=\"right\"> 2 </td>
<td> 1, 2 </td>
<td> asd, dfdsf </td>
<td align="left"> 1 </td>
<td> <script>
function openWindow1() { var newtab1 = window.open("", "anotherWindow", "width=300,height=150");
newtab1.document.open();
newtab1.document.write('<table border=1> <button onclick="window.opener.exportTableToCSV(\'members.csv\');">Export HTML Table To CSV File</button><br></br><tr><th>Ratings_e</th><th>Text_e</th></tr><tr><td>1</td><td>asd</td></tr><tr><td> 2</td><td> dfdsf</td></tr></table>');
function exportTableToCSV(filename) {
alert("I am an alert box!");
var csv = [];
var rows = document.querySelectorAll("table tr");
for (var i = 0; i < rows.length; i++) {
var row = [], cols = rows[i].querySelectorAll("td, th");
for (var j = 0; j < cols.length; j++)
row.push(cols[j].innerText);
csv.push(row.join(","));
}
// Download CSV file
alert('Hey')
downloadCSV(csv.join("\n"), filename);
}
function downloadCSV(csv, filename) {
var csvFile;
var downloadLink;
// CSV file
csvFile = new Blob([csv], {type: "text/csv"});
// Download link
downloadLink = document.createElement("a");
// File name
downloadLink.download = filename;
// Create a link to the file
downloadLink.href = window.URL.createObjectURL(csvFile);
// Hide download link
downloadLink.style.display = "none";
// Add the link to DOM
document.body.appendChild(downloadLink);
// Click download link
downloadLink.click();
}
}
</script>
<button onclick="openWindow1()"> Open Window </button>
</td> </tr> </table>
@用户11740857
您的代码已经可以工作,除了一个愚蠢的错误,那就是您放错了“openWindow1”函数的结束}。
当您将其放在“downloadCSV”函数之后时,这意味着“exportTableToCSV”和“downloadCSV”在函数“openWindow1”的范围内,并且不会在父窗口本身中定义,因此您不能使用“window” .opener”来访问该功能。
解决方案 1:(可能是最好的解决方案)
<table border=1>
<tr>
<th></th>
<th> sub_domain</th>
<th> nReviews</th>
<th> Ratings_e</th>
<th> Text_e</th>
<th> rn</th>
<th> launcher_html</th>
</tr>
<tr>
<td align=\"right\"> 1</td>
<td> a1</td>
<td align=\"right\"> 2</td>
<td> 1, 2</td>
<td> asd, dfdsf</td>
<td align="left"> 1</td>
<td>
<script>
function openWindow1() {
var newtab1 = window.open("", "anotherWindow", "width=300,height=150");
newtab1.document.open();
newtab1.document.write('<table border=1> <button onclick="window.opener.exportTableToCSV(\'members.csv\');">Export HTML Table To CSV File</button><br></br><tr><th>Ratings_e</th><th>Text_e</th></tr><tr><td>1</td><td>asd</td></tr><tr><td> 2</td><td> dfdsf</td></tr></table>');
}
function exportTableToCSV(filename) {
alert("I am an alert box!");
var csv = [];
var rows = document.querySelectorAll("table tr");
for (var i = 0; i < rows.length; i++) {
var row = [], cols = rows[i].querySelectorAll("td, th");
for (var j = 0; j < cols.length; j++)
row.push(cols[j].innerText);
csv.push(row.join(","));
}
// Download CSV file
alert('Hey')
downloadCSV(csv.join("\n"), filename);
}
function downloadCSV(csv, filename) {
var csvFile;
var downloadLink;
// CSV file
csvFile = new Blob([csv], {type: "text/csv"});
// Download link
downloadLink = document.createElement("a");
// File name
downloadLink.download = filename;
// Create a link to the file
downloadLink.href = window.URL.createObjectURL(csvFile);
// Hide download link
downloadLink.style.display = "none";
// Add the link to DOM
document.body.appendChild(downloadLink);
// Click download link
downloadLink.click();
}
</script>
<button onclick="openWindow1()"> Open Window</button>
</td>
</tr>
</table>
另一种选择是将这些函数定义为变量并将它们提供给打开的窗口。但上面的代码应该可以工作。
此外,我建议您使用突出显示代码缩进的 IDE,这样您就不会因为这个错误而感到沮丧!
Cheers
EDITED
抱歉,我没有看到它正在导出父表的内容。这是范围的问题。您需要定义函数才能访问新窗口的范围。这里是相关代码,您可以在其中看到我在新窗口中声明导出函数,并且我们将作用域窗口传递给第一个函数。这样您也可以在父窗口中使用该功能。
检查是否满足您的需求
<table border=1>
<tr>
<th></th>
<th> sub_domain</th>
<th> nReviews</th>
<th> Ratings_e</th>
<th> Text_e</th>
<th> rn</th>
<th> launcher_html</th>
</tr>
<tr>
<td align=\"right\"> 1</td>
<td> a1</td>
<td align=\"right\"> 2</td>
<td> 1, 2</td>
<td> asd, dfdsf</td>
<td align="left"> 1</td>
<td>
<script>
function openWindow1() {
var newtab1 = window.open("", "anotherWindow", "width=300,height=150");
newtab1.document.open();
newtab1.document.write('<table border=1> <button onclick="exportTableToCSV(window,\'members.csv\');">Export HTML Table To CSV File</button><br></br><tr><th>Ratings_e</th><th>Text_e</th></tr><tr><td>1</td><td>asd</td></tr><tr><td> 2</td><td> dfdsf</td></tr></table>');
newtab1.exportTableToCSV = exportTableToCSV;
newtab1.downloadCSV = downloadCSV;
}
function exportTableToCSV(scopedWindow,filename) {
alert("I am an alert box!");
var csv = [];
var rows = scopedWindow.document.querySelectorAll("table tr");
for (var i = 0; i < rows.length; i++) {
var row = [], cols = rows[i].querySelectorAll("td, th");
for (var j = 0; j < cols.length; j++)
row.push(cols[j].innerText);
csv.push(row.join(","));
}
// Download CSV file
alert('Hey')
scopedWindow.downloadCSV(csv.join("\n"), filename);
}
function downloadCSV(csv, filename) {
var csvFile;
var downloadLink;
// CSV file
csvFile = new Blob([csv], {type: "text/csv"});
// Download link
downloadLink = document.createElement("a");
// File name
downloadLink.download = filename;
// Create a link to the file
downloadLink.href = window.URL.createObjectURL(csvFile);
// Hide download link
downloadLink.style.display = "none";
// Add the link to DOM
document.body.appendChild(downloadLink);
// Click download link
downloadLink.click();
}
</script>
<button onclick="openWindow1()"> Open Window</button>
</td>
</tr>
</table>
干杯x2
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)