在学习工作,使用浏览器的过程中,经常需要随手记一下东西,当然有很多办法解决这个问题,下面是酷且便捷的一种。
data:text/html,
<style type="text/css">
#e {
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
font-size:16px;
}
</style>
<div id="e"></div>
<script src="http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js"></script>
<script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<script>
var myKey="SecretKey_MyData";
$(document).ready(function(){
var e = ace.edit("e");
var url = "http://api.openkeyval.org/"+myKey;
$.ajax({
url: url,
dataType: "jsonp",
success: function(data){
e.setTheme("ace/theme/tomorrow_night_eighties");
e.getSession().setMode("ace/mode/markdown");
e.setValue(data);
}
});
$("#e").on("keydown", function (b) {
if (b.ctrlKey && 83 == b.which) {
b.preventDefault();
var data = myKey+"="+encodeURIComponent(e.getValue());
$.ajax({
data: data,
url: "http://api.openkeyval.org/store/",
dataType: "jsonp",
success: function(data){
alert("Saved.");
}
});
}
});
});
</script>
将如上代码复制下来输入到浏览器(不支持IE)地址栏中,敲下回车,你就得到了一个可识别多种编程语言的漂亮的编辑器,按下 CTRL+S 可以将文本内容保存下来。
可以将这个“地址”加入书签栏,方便下次使用。
你输入的内容不是保存在本地的,是将其保存在 http://openkeyval.org/ 这个开放的key-value在线存储站点的web存储服务上了。
var url = "http://api.openkeyval.org/"+myKey;
可以看到如上代码,在打开时会调用openkeyval.org取值的api,将你设置的key的value显示出来,
url: "http://api.openkeyval.org/store/",
按下CTRL+S时会调用openkeyval.org存储的api,将对应的key-value保存下来。
既然是开放的key-value式的存储,那么就需要你使用一个不同的key了,否则有人跟你使用相同key的话你们会相互覆盖的。所以在如上代码中,找到
var myKey="SecretKey_MyData";
这一行,然后将myKey换成你自己的独特的key,这样就能较为放心的使用啦。下次在打开这个页面都能看到以前编辑的内容了。如果有需要,也可以把你的key存储的内容共享给他人用。
如上代码来源: http://www.36kr.com/p/201096.html