gpt4 book ai didi

javascript - 导出 div 内容的脚本在 Chrome 中有效,但在 Firefox 中无效

转载 作者:行者123 更新时间:2023-11-30 12:46:51 24 4
gpt4 key购买 nike

我有以下脚本将 div 内容导出为文本:

JavaScript

  <script type="text/javascript">

// Wait for the page to load first
window.onload = function() {

//Get a reference to the link on the page
// with an id of "mylink"
var a = document.getElementById("exportxt");

//Set code to run when the link is clicked
// by assigning a function to "onclick"
a.onclick = function() {

// Your code here...


function downloadInnerHtml(filename, elId, mimeType) {
var elHtml = document.getElementById(elId).innerHTML;
var link = document.createElement('a');
mimeType = mimeType || 'text/plain';
link.setAttribute('download', filename);
link.setAttribute('href', 'data:' + mimeType + ';charset=utf-8,' + encodeURIComponent(elHtml));
link.click();
}
var fileName = 'meucanvas.txt'; // You can use the .txt extension if you want
downloadInnerHtml(fileName, 'editor','text/plain');
//If you don't want the link to actually
// redirect the browser to another page,
// "google.com" in our example here, then
// return false at the end of this block.
// Note that this also prevents event bubbling,
// which is probably what we want here, but won't
// always be the case.
return false;
}
}

</script>

HTML

<div style="float:left; padding-left:5px;">
<a id="exportxt">
<label>
<button type="submit" value="#" style="border: 0; background: transparent">
<b>CLICK HERE DOWNLOAD AS TXT</b>
</button>
</label>
</a>
</div>




<div id="editor">
</br>
</br>




TEXT TEXT TEXT

http://jsfiddle.net/JVke4

但是,它在 Firefox 中不起作用。适用于 Chrome。如何使其跨浏览器兼容?

是onclick事件吗?

最佳答案

问题不一定是window.onload

你的问题是你没有在页面上添加链接元素,试试这个:

function downloadInnerHtml(filename, elId, mimeType) {
var elHtml = document.getElementById(elId).innerHTML;
var link = document.createElement('a');
mimeType = mimeType || 'text/plain';
link.setAttribute('download', filename);
link.setAttribute('href', 'data:' + mimeType + ';charset=utf-8,' + encodeURIComponent(elHtml));
link.style.cssText = "position: aboslute !important; left: -9999px; visibility: hidden;";//hide element
link.innerHTML = "text";
document.body.appendChild(link);
link.click();
setTimeout(function(){
document.body.removeChild(link);//remove element
}, 1);
}

// Wait for the page to load first
window.onload = function() {

//Get a reference to the link on the page
// with an id of "mylink"
var a = document.getElementById("exportxt");

//Set code to run when the link is clicked
// by assigning a function to "onclick"
a.onclick = function() {

// Your code here...
var fileName = 'meucanvas.txt'; // You can use the .txt extension if you want
downloadInnerHtml(fileName, 'editor','text/plain');
//If you don't want the link to actually
// redirect the browser to another page,
// "google.com" in our example here, then
// return false at the end of this block.
// Note that this also prevents event bubbling,
// which is probably what we want here, but won't
// always be the case.
return false;
}
}

提示:

在某些浏览器中,您可能使用属性下载不起作用(可能是手机)尝试 application/octet-stream,例如:

function downloadInnerHtml(filename, elId, mimeType) {
var elHtml = document.getElementById(elId).innerHTML;
var link = document.createElement('a');
mimeType = mimeType || 'application/octet-stream';
link.setAttribute('download', filename);
link.setAttribute('href', 'data:' + mimeType + ';charset=utf-8,' + encodeURIComponent(elHtml));
link.style.cssText = "position: aboslute !important; left: -9999px; visibility: hidden;";//hide element
link.innerHTML = "text";
document.body.appendChild(link);
link.click();
setTimeout(function(){
document.body.removeChild(link);//remove element
}, 1);
}
...
downloadInnerHtml('test.txt', 'editor');//force download

关于javascript - 导出 div 内容的脚本在 Chrome 中有效,但在 Firefox 中无效,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22256657/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com