纯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 相关文章推荐
使用jQuery的将桌面应用程序引入浏览器
Nov 19 Javascript
jQuery.holdReady()方法用法实例
Dec 27 Javascript
JavaScript代码实现左右上下自动晃动自动移动
Apr 08 Javascript
JS打印组合功能
Aug 04 Javascript
JS中使用mailto实现将用户在网页中输入的内容传递到本地邮件客户端
Oct 08 Javascript
JS去除字符串中空格的方法
Feb 14 Javascript
xmlplus组件设计系列之按钮(2)
Apr 26 Javascript
使用socket.io实现简单聊天室案例
Jan 02 Javascript
Vue.js添加组件操作示例
Jun 13 Javascript
微信小程序实现团购或秒杀批量倒计时
Nov 01 Javascript
如何使用JavaScript实现栈与队列
Jun 24 Javascript
如何解决jQuery 和其他JS库的冲突
Jun 22 jQuery
点图片上一页下一页翻页效果
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递归json类实例
2014/12/02 PHP
php利用cookie实现自动登录的方法
2014/12/10 PHP
php通过淘宝API查询IP地址归属等信息
2015/12/25 PHP
PHP微信开发用Cache 解决数据缓存
2016/07/11 PHP
PHP串行化与反串行化实例分析
2016/12/27 PHP
PHP调用API接口实现天气查询功能的示例
2017/09/21 PHP
window.open()弹出居中的窗口
2007/02/01 Javascript
用JavaScript实现仿Windows关机效果
2007/03/10 Javascript
javaScript 判断字符串是否为数字的简单方法
2009/07/25 Javascript
javascript 用记忆函数快速计算递归函数
2010/03/15 Javascript
jquery validate.js表单验证的基本用法入门
2010/05/13 Javascript
JQuery文本框高亮显示插件代码
2011/04/02 Javascript
文本框中禁止非数字字符输入比如手机号码、邮编
2013/08/19 Javascript
判断js中各种数据的类型方法之typeof与0bject.prototype.toString讲解
2013/11/07 Javascript
使用upstart把nodejs应用封装为系统服务实例
2014/06/01 NodeJs
Node.js实现Excel转JSON
2015/04/24 Javascript
JavaScript 控制字体大小设置的方法
2016/11/23 Javascript
angular4中关于表单的校验示例
2017/10/16 Javascript
vue spa应用中的路由缓存问题与解决方案
2019/05/31 Javascript
JavaScript:ES2019 的新特性(译)
2019/08/08 Javascript
nodejs实现聊天机器人功能
2019/09/19 NodeJs
全网小程序接口请求封装实例代码
2020/11/06 Javascript
Python计时相关操作详解【time,datetime】
2017/05/26 Python
python简单实现操作Mysql数据库
2018/01/29 Python
深入浅析Python传值与传址
2018/07/10 Python
python requests指定出口ip的例子
2019/07/25 Python
通过实例简单了解Python中yield的作用
2019/12/11 Python
利用PyCharm操作Github(仓库新建、更新,代码回滚)
2019/12/18 Python
python 遗传算法求函数极值的实现代码
2020/02/11 Python
pycharm 实现本地写代码,服务器运行的操作
2020/06/08 Python
美国宠物商店:Wag.com
2016/10/25 全球购物
美国知名艺术画网站:Art.com
2017/02/09 全球购物
编辑求职信样本
2013/12/16 职场文书
工作汇报开头与结尾怎么写
2014/11/08 职场文书
爱岗敬业事迹材料
2019/06/20 职场文书
优化Mysql查询的示例
2022/04/26 MySQL