纯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 相关文章推荐
javascript编程起步(第六课)
Jan 10 Javascript
菜鸟javascript基础资料整理3 正则
Dec 06 Javascript
JS处理json日期格式化问题
Oct 01 Javascript
基于javascript实现最简单的选项卡切换效果
May 16 Javascript
基于javascript实现按圆形排列DIV元素(二)
Dec 02 Javascript
常用JS图片滚动(无缝、平滑、上下左右滚动)代码大全(推荐)
Dec 20 Javascript
深入理解JavaScript 参数按值传递
May 24 Javascript
微信小程序 扭蛋抽奖机css3动画实现详解
Jul 19 Javascript
vue cli3 调用百度翻译API翻译页面的实现示例
Sep 13 Javascript
解决layui数据表格排序图标被超出的表头挤出去的问题
Sep 19 Javascript
vue2.0 解决抽取公用js的问题
Jul 31 Javascript
解决vue net :ERR_CONNECTION_REFUSED报错问题
Aug 13 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
php date()日期时间函数详解
2010/05/16 PHP
在WordPress中实现发送http请求的相关函数解析
2015/12/29 PHP
利用php_imagick实现复古效果的方法
2016/10/18 PHP
PHP使用strrev翻转中文乱码问题的解决方法
2017/01/13 PHP
PHP中大括号'{}'用法实例总结
2017/02/08 PHP
JQuery 国际象棋棋盘 实现代码
2009/06/26 Javascript
JavaScript 利用StringBuffer类提升+=拼接字符串效率
2009/11/24 Javascript
js 完美图片新闻轮转效果,腾讯大粤网首页图片轮转改造而来
2011/11/21 Javascript
js动态创建表格,删除行列的小例子
2013/07/20 Javascript
js 操作select与option(示例讲解)
2013/12/20 Javascript
在css加载完毕后自动判断页面是否加入css或js文件
2014/09/10 Javascript
node.js中的fs.appendFile方法使用说明
2014/12/17 Javascript
在jQuery中处理XML数据的大致方法
2015/08/14 Javascript
jQuery入门之层次选择器实例简析
2015/12/11 Javascript
基于javascript实现按圆形排列DIV元素(三)
2016/12/02 Javascript
AngularJS指令与指令之间的交互功能示例
2016/12/14 Javascript
Bootstrap面板学习使用
2017/02/09 Javascript
js获取当前页的URL与window.location.href简单方法
2017/02/13 Javascript
JS实现动态添加DOM节点和事件的方法示例
2017/04/28 Javascript
iview给radio按钮组件加点击事件的实例
2017/09/30 Javascript
p5.js临摹动态图形实现方法详解
2019/10/23 Javascript
jquery实现简易验证插件封装
2020/09/13 jQuery
javascript实现智能手环时间显示
2020/09/18 Javascript
纯CSS实现设置半个字符的样式
2014/07/03 HTML / CSS
深入浅析HTML5中的SVG
2015/11/27 HTML / CSS
Hawes & Curtis澳大利亚官网:英国经典服饰品牌
2018/10/29 全球购物
女性时尚在线:IVRose
2019/02/23 全球购物
Mybag美国/加拿大:英国奢华包包和名牌手袋网站
2020/02/16 全球购物
六一儿童节活动策划方案
2014/01/27 职场文书
社区八一活动方案
2014/02/03 职场文书
幼儿教师寄语集锦
2014/04/03 职场文书
企业精神口号
2014/06/11 职场文书
世博会口号
2014/06/20 职场文书
学习焦裕禄精神践行三严三实心得体会
2014/10/13 职场文书
python可视化分析绘制带趋势线的散点图和边缘直方图
2022/06/25 Python
Win11 Beta 22621.601 和 22622.601今日发布 KB5017384修复内容汇总
2022/09/23 数码科技