html中的一个属性。设置html的contentEditable=‘true’时,即可开启该元素的编辑模式。
我在body 加入contentEditable属性,打开页面的即可在网上编译。
·Tips:contenteditable是一个枚举类型的属性,可供选择的值有 空字符串、 true、false 或 inherit(默认)。
当为空字符串的时候,效果与true相同。
·摘除:百度。
现在来点有意思的,在地址栏内输入:data:text/html, <html contenteditable>
可以把网页当做一个简单的编辑器。
补充:或者来自极客的更新,这一小段代码就可以在一个高亮的编辑器内编辑了!
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="SecretKeyz"; $(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>
·Tip:这个跟http://notepad.cc/rogeji8差不多!
浙公网安备 33010602011771号