save the content of HTML editor as an HTML file on desktop
Question
I want to save the content of a TinyMce HTML editor by clicking on a button. The TinyMce is on a local installation, and I use it in Chrome. I have see this answer and that one but I am not able to implement them. When I click on the Save button, I don't get the download pop up, even though my code on JSfidle is working
So here is my TinyMCEnote.hmlt (save in desktop/TinyMceLocal)
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function saveTextAsFile()
{
var textToWrite = document.getElementById('textArea').value;
var textFileAsBlob = new Blob([textToWrite], {type:'text/plain'});
var fileNameToSaveAs = "ecc.plist";
var downloadLink = document.createElement("a");
downloadLink.download = fileNameToSaveAs;
downloadLink.innerHTML = "Download File";
downloadLink.href = window.webkitURL.createObjectURL(textFileAsBlob);
downloadLink.click();
}
var button = document.getElementById('save');
button.addEventListener('click', saveTextAsFile);
</script>
</head>
<body>
<textarea id = "textArea">
Notes here...
</textarea>
<button type="button" value="save" id="save"> Save</button>
</body>
</html>
2 answers
solution1
2 2017-01-31 12:42:50
I can not comment, but I want to help you a little.
When you run the code it seems like Event Code
var button = document.getElementById('save');
button.addEventListener('click', saveTextAsFile)
When I run the consle I get this error message:
Uncaught TypeError: Cannot read property 'addEventListener' of null
I am trying to know why its saying addEventListener is null .. You may know how to fix it since now you know what's causing the problem or someone with more experience.
solution2
2 ACCPTED 2017-01-31 19:02:01
Calling the function with onclick made the trick:
<!DOCTYPE html>
<html>
<head>
<script>
function saveTextAsFile()
{
var textToWrite = tinyMCE.activeEditor.getContent();
var textFileAsBlob = new Blob([textToWrite], {type:'text/plain'});
var fileNameToSaveAs = "note.html";
var downloadLink = document.createElement("a");
downloadLink.download = fileNameToSaveAs;
downloadLink.innerHTML = "Download File";
downloadLink.href = window.webkitURL.createObjectURL(textFileAsBlob);
downloadLink.click();
};
</script>
</head>
<body>
<textarea id = "textArea" cols="40" rows="40">
</textarea>
<button onclick="saveTextAsFile()">Save Note Content</button>
</body>
</html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.