发一个代码运行框。省得每次把网上的代码拷下来都要新建一个html页面，黏贴，保存运行。。。
下班啦。。代码贴完就走人。。
支持 运行代码(兼容各类浏览器),保存、打印(支持IE)
这是效果图
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>coder</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style>
#container #code{
width:400px;
height:200px;
resize:none;
background:none;
border:1px solid gray;
}
#container button ,#container .btn{
border:1px solid gray;
cursor:pointer;
padding:0px;
width:75px;
height:23px;
}
#container button:hover,#container .btn:hover{
}
</style>
<script type="text/javascript">
function Coder (id) {
this.id = id;
this.$ = function(id) {
return document.getElementById(id);
}
this.runcode = function() {
var codeWin = window.open("about:blank","_blank")
codeWin.document.writeln(this.obj.value);
return codeWin;
}
this.savecode = function() {
var codeWin = this.runcode();
var title = codeWin.document.title || "code" ;
codeWin.document.execCommand("SaveAs",false,title+".html");
codeWin.close();
}
this.printcode =function() {
var codeWin = this.runcode();
codeWin.document.execCommand("Print",false,"");
codeWin.close();
}
this.init=function() {
this.obj = this.$(this.id);
var context = this;
this.$("run").onclick = function() {
context.runcode();
};
this.$("save").οnclick=function(){
context.savecode();
}
this.$("print").οnclick=function(){
context.printcode();
}
}
}
var coder = new Coder("code");
window.onload = function() {coder.init();};
</script>
</head>
<body>
<h3>请输入代码：</h3>
<div id="container">
<p><textarea id="code"><!DOCTYPE html>
<html>
<head>
<title>coder</title>
</head>
<body>
</body>
</html></textarea></p>
<button type="button" id="run">运行</button>
<button type="button" id="save">保存</button>
<button type="button" id="print">打印</button>
</div>
</body>
</html>
2671
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
