如何从我的网页中保存Arduino代码".ino扩展“？
如何从我的网页中保存Arduino代码".ino扩展“？
提问于 2019-08-11 09:13:56
我创建了一个网页来编写Arduino代码，然后我想将代码保存在pc上，所以我使用新Blob保存文件，扩展名是.ino，但是当我转到创建的文件时，我得到了以下消息
无法创建草图 未能打开草图：“文件的方向”
我想知道如何保存.ino文件
var textToSaveAsBlob = new Blob([encodeURIComponent(arduinoSource)], {type:'data:text/ino;charset=utf-8,'});
var datenow = Date.now();
var fileNameToSaveAs = "arduino_code" +datenow+ ".ino";
saveAs(textToSaveAsBlob, fileNameToSaveAs);回答 1
Stack Overflow用户
回答已采纳
发布于 2019-08-11 14:30:55
您可以使用锚元素中的数据URI生成下载。不过浏览器支持各不相同，请查看维基百科描述。
例如，下面的函数接受文件名和代码并生成下载。它的工作方式是在DOM中创建一个锚元素，定义文件的字符集和内容类型，追加代码，在锚元素上启动单击事件以生成下载，然后销毁该元素。
function download(filename, code) {
var element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(code));
element.setAttribute('download', filename);
element.style.display = 'none';
document.body.appendChild(element);
element.click();
document.body.removeChild(element);
}我编写了以下代码片段来生成所需的功能，还添加了一些Arduino样式的CSS。希望能帮上忙！
function download(filename, code) {
var element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(code));
element.setAttribute('download', filename);
element.style.display = 'none';
document.body.appendChild(element);
element.click();
document.body.removeChild(element);
}
var dateNow = Date.now();
var fileName = 'ArduinoCode';
document.getElementById("arduino-file-name").innerHTML = fileName;
document.getElementById("download-code").addEventListener("click", function() {
var arduinoCode = document.getElementById("arduino-code").value;
var fileNameFull = fileName + "-" + dateNow + ".ino";
download(fileNameFull, arduinoCode);
}, false);.arduino-menu-bar {
background-color: #006468;
padding: 10px;
}
.arduino-menu-bar--footer {
display: block;
height: 10px;
background-color: #4db7bb;
}
#download-code {
border: none;
color: #4db7bb;
font-size: 30px;
cursor: pointer;
}
#download-code:hover {
color: #7ac4c7;
}
.arduino-files-bar {
background-color: #4db7bb;
padding: 5px 5px 0 5px;
}
.open-file-title {
background-color: #fff;
padding: 5px 15px;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
display: inline-block;
color: #006468;
font-family: Arial, Helvetica, sans-serif;
}
#arduino-code {
font-family: 'Fira Code', monospace;
outline: none;
display: block;
width: 100%;
height: 250px;
border: 0px;
font-size: 14px;
resize: none;
}<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
<link href="https://fonts.googleapis.com/css?family=Fira+Code&display=swap" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css">
<div class="arduino-code-container">
<div class="arduino-menu-bar">
<i id="download-code" class="fas fa-cloud-download-alt"></i>
</div>
<div class="arduino-files-bar">
<div id="arduino-file-name" class="open-file-title"></div>
</div>
<textarea id="arduino-code">
void setup() {
// initialize digital pin LED_BUILTIN as an output.
pinMode(LED_BUILTIN, OUTPUT);
}
// the loop function runs over and over again forever
void loop() {
digitalWrite(LED_BUILTIN, HIGH); // turn the LED on (HIGH is the voltage level)
delay(1000); // wait for a second
digitalWrite(LED_BUILTIN, LOW); // turn the LED off by making the voltage LOW
delay(1000); // wait for a second
}
</textarea>
<div class="arduino-menu-bar arduino-menu-bar--footer"></div>
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/57448725
复制相关文章
相似问题
腾讯云开发者
