纯js实现的论坛常用的运行代码的效果


Posted in Javascript onJuly 15, 2008

用的时候把runcode.js放到网站目录,在需要运行代码的效果的地方放如下的代码

<div style="margin-top: 1em; margin-bottom: 1em"><div style="display:none">{1}</div><textarea rows="12" cols="95" style='font-family:"Courier New",Courier,monospace;'></textarea><script src="runcode.js"></script><br /><input type="button" value="运行代码" style="border-left:1px solid #B1B4CD;border-right:1px solid #494D74;border-top:1px solid #B1B4CD;;border-bottom:1px solid #494D74;background:#696D81;color:#FFFFFF;" onclick="runCode(this)"> <input type="button" style="border-left:1px solid #B1B4CD;border-right:1px solid #494D74;border-top:1px solid #B1B4CD;;border-bottom:1px solid #494D74;background:#696D81;color:#FFFFFF;"value="复制代码" onclick="copycode(this)"> <input type="button" style="border-left:1px solid #B1B4CD;border-right:1px solid #494D74;border-top:1px solid #B1B4CD;;border-bottom:1px solid #494D74;background:#696D81;color:#FFFFFF;"value="另存代码" onclick="saveCode(this)"> <input type="button" style="border-left:1px solid #B1B4CD;border-right:1px solid #494D74;border-top:1px solid #B1B4CD;;border-bottom:1px solid #494D74;background:#696D81;color:#FFFFFF;"value="还原代码" onclick="preCode(this)">  提示:您可以先修改部分代码再运行</div>

就可以了。
runcode.js文件
//Scripts runcode for BBS ver 2008-06-30, by Bound0(bound0@veryhman.com) 
//First published at http://bbs.blueidea.com 
//An example: http://bbs.veryhman.com/showtopic-20094.aspx function runCode(which) { 
    var p=which.parentNode; 
    var os=p.getElementsByTagName("textarea"); 
    if(os.length==0)return; 
    var o=os[0]; 
        var winname = window.open('', "_blank", ''); 
        winname.document.open('text/html', 'replace'); 
        winname.opener = null; 
        winname.document.write(o.value); 
        winname.document.close(); 
} 
function saveCode(which) { 
    var p=which.parentNode; 
    var os=p.getElementsByTagName("textarea"); 
    if(os.length==0)return; 
    var o=os[0]; 
        var winname = window.open('', '_blank', 'top=10000'); 
        winname.document.open('text/html', 'replace'); 
        winname.document.write(o.value); 
        winname.document.execCommand('saveas','','code.htm'); 
        winname.close(); 
} 
function copycode(which) { 
    var p=which.parentNode; 
    var os=p.getElementsByTagName("textarea"); 
    if(os.length==0)return; 
    var o=os[0]; 
    var is_ie = (userAgent.indexOf('msie') != -1 && !is_opera) && userAgent.substr(userAgent.indexOf('msie') + 5, 3); 
    if(is_ie && o.style.display != 'none') { 
        var rng = document.body.createTextRange(); 
        rng.moveToElementText(o); 
        rng.scrollIntoView(); 
        rng.select(); 
        rng.execCommand("Copy"); 
        rng.collapse(false); 
    } 
} 
function text(e) 
{ 
    var t = ""; 
    e = e.childNodes || e; 
    for ( var j = 0; j < e.length; j++ ) 
    { 
        if(e[j].nodeType != 1){t+=e[j].nodeValue} 
        else 
        { 
            var k=e[j].nodeName; 
            if(k=='BR'||k=='P'){t+='\r\n'} 
            t+=text(e[j].childNodes) 
        } 
    } 
    return t; 
} 
function preCode(which) { 
    var p=which.parentNode; 
    var os=p.getElementsByTagName("textarea"); 
    if(os.length==0)return; 
    var o=os[0]; 
    var osv=p.getElementsByTagName("div"); 
    if(osv.length==0)return; 
    var ov=osv[0]; 
    var c='' 
    if(typeof(ov.innerText)!="undefined"){c=ov.innerText}else{c=text(ov)} 
    o.value=c 
} 
(function(){var s=document.getElementsByTagName("script");preCode(s[s.length-1])})()

Javascript 相关文章推荐
Knockoutjs快速入门(经典)
Dec 24 Javascript
javascript弹出层输入框(示例代码)
Dec 11 Javascript
使用jQuery实现的掷色子游戏动画效果
Mar 14 Javascript
重写document.write实现无阻塞加载js广告(补充)
Dec 12 Javascript
Bootstrap树形组件jqTree的简单封装
Jan 25 Javascript
jQuery四种选择器使用及示例
Jun 05 Javascript
基于Turn.js 实现翻书效果实例解析
Jun 20 Javascript
JavaScript禁止用户多次提交的两种方法
Jul 24 Javascript
JavaScript 完成注册页面表单校验的实例
Aug 19 Javascript
JS自定义函数实现时间戳转换成date的方法示例
Aug 27 Javascript
Vue 去除路径中的#号
Apr 19 Javascript
vuex vue简单使用知识点总结
Aug 29 Javascript
点图片上一页下一页翻页效果
Jul 09 #Javascript
JS的数组的扩展实例代码
Jul 09 #Javascript
JS location几个方法小姐
Jul 09 #Javascript
非常不错的功能强大代码简单的管理菜单美化版
Jul 09 #Javascript
javascript jQuery $.post $.ajax用法
Jul 09 #Javascript
javascript同步Import,同步调用外部js的方法
Jul 08 #Javascript
SWFObject Flash js调用类
Jul 08 #Javascript
You might like
Cakephp 执行主要流程
2010/03/24 PHP
php开发过程中关于继承的使用方法分享
2011/06/17 PHP
php获取远程文件内容的函数
2015/11/02 PHP
PHP 微信支付类 demo
2015/11/30 PHP
PHP实现的一致性Hash算法详解【分布式算法】
2018/03/31 PHP
PHP使用PDO 连接与连接管理操作实例分析
2020/04/21 PHP
如何实现浏览器上的右键菜单
2006/07/10 Javascript
有一段有意思的代码-javascript现实多行信息
2007/08/26 Javascript
THREE.JS入门教程(6)创建自己的全景图实现步骤
2013/01/25 Javascript
如何使用Javascript获取距今n天前的日期
2013/07/08 Javascript
教你用jquery实现iframe自适应高度
2014/06/11 Javascript
jquery实现全选、反选、获得所有选中的checkbox
2020/09/13 Javascript
js实现网页图片延时加载 提升网页打开速度
2016/01/26 Javascript
JS实现快速的导航下拉菜单动画效果附源码下载
2016/11/01 Javascript
Three.js获取鼠标点击的三维坐标示例代码
2017/03/24 Javascript
angular.js指令中transclude选项及ng-transclude指令详解
2017/05/24 Javascript
详解Vue中一种简易路由传参办法
2017/09/15 Javascript
JS+jQuery实现注册信息的验证功能
2017/09/26 jQuery
基于Vue2.0+ElementUI实现表格翻页功能
2017/10/23 Javascript
vue3.0 搭建项目总结(详细步骤)
2019/05/20 Javascript
五种Python转义表示法
2020/11/27 Python
python中uuid模块实例浅析
2020/12/29 Python
Jmeter调用Python脚本实现参数互相传递的实现
2021/01/22 Python
HTML5 canvas基本绘图之绘制阴影效果
2016/06/27 HTML / CSS
canvas三角函数模拟水波效果的示例代码
2018/07/03 HTML / CSS
沙特阿拉伯网上购物:Sayidaty Mall
2018/05/06 全球购物
自荐书封面下载
2013/11/29 职场文书
文员的职业生涯规划发展方向
2014/02/08 职场文书
政府绩效管理实施方案
2014/05/04 职场文书
大学生社会实践方案
2014/05/11 职场文书
安全生产月宣传标语
2014/10/06 职场文书
Mysql Online DDL的使用详解
2021/05/20 MySQL
Mysql 如何查询时间段交集
2021/06/08 MySQL
使用ORM新增数据在Mysql中的操作步骤
2021/07/26 MySQL
Python 全局空间和局部空间
2022/04/06 Python
华为HarmonyOS3.0强在哪? 看看鸿蒙3.0这7个小功能
2023/01/09 数码科技