纯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 11 Javascript
JavaScript splice()方法详解
Sep 22 Javascript
原生js获取宽高与jquery获取宽高的方法关系对比
Apr 04 Javascript
javaScript中两个等于号和三个等于号之间的区别介绍
Jun 27 Javascript
IE下通过a实现location.href 获取referer的值
Sep 04 Javascript
jQuery实现防止提交按钮被双击的方法
Mar 24 Javascript
jQuery实现仿美橙互联两级导航菜单效果完整实例
Sep 17 Javascript
JS判断字符串变量是否含有某个字串的实现方法
Jun 03 Javascript
JS模拟的Map类实现方法
Jun 17 Javascript
浅谈js中对象的使用
Aug 11 Javascript
Node.js中使用jQuery的做法
Aug 17 Javascript
JavaScript 获取元素在父节点中的下标(推荐)
Jun 28 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实现的封装验证码类详解
2013/06/18 PHP
Laravel中前端js上传图片到七牛云的示例代码
2017/09/04 PHP
PHP实现的权重算法示例【可用于游戏根据权限来随机物品】
2019/02/15 PHP
PHP创建XML的方法示例【基于DOMDocument类及SimpleXMLElement类】
2019/09/10 PHP
基于laravel Request的所有方法详解
2019/09/29 PHP
实现laravel 插入操作日志到数据库的方法
2019/10/11 PHP
几种设置表单元素中文本输入框不可编辑的方法总结
2013/11/25 Javascript
js调用浏览器打印模块实现点击按钮触发自定义函数
2014/03/21 Javascript
js限制checkbox选中个数以限制六个为例
2014/07/15 Javascript
JavaScript的null和undefined区别示例介绍
2014/09/15 Javascript
JavaScript实现更改网页背景与字体颜色的方法
2015/02/02 Javascript
jQuery 操作input中radio的技巧
2016/07/18 Javascript
微信小程序进行微信支付的步骤昂述
2016/12/01 Javascript
Vue单文件组件基础模板小结
2017/08/10 Javascript
Vue项目服务器部署之子目录部署方法
2019/05/12 Javascript
Vue 通过公共字段,拼接两个对象数组的实例
2019/11/07 Javascript
基于Element封装一个表格组件tableList的使用方法
2020/06/29 Javascript
python写xml文件的操作实例
2014/10/05 Python
在Linux系统上部署Apache+Python+Django+MySQL环境
2015/12/24 Python
python 打印对象的所有属性值的方法
2016/09/11 Python
python实现k-means聚类算法
2018/02/23 Python
使用python读取txt文件的内容,并删除重复的行数方法
2018/04/18 Python
Selenium定位元素操作示例
2018/08/10 Python
网易有道2017内推编程题 洗牌(python)
2019/06/19 Python
python基于gevent实现并发下载器代码实例
2019/11/01 Python
python制作朋友圈九宫格图片
2019/11/03 Python
python 装饰器的实际作用有哪些
2020/09/07 Python
新加坡航空官方网站:Singapore Airlines
2016/10/13 全球购物
银行先进个人事迹材料
2014/05/11 职场文书
金融与证券专业求职信
2014/06/22 职场文书
秋季校运会广播稿100字
2014/09/18 职场文书
介绍信格式样本
2015/05/05 职场文书
建筑工程催款函
2015/06/24 职场文书
Python 文本滚动播放器的实现代码
2021/04/25 Python
深入理解以DEBUG方式线程的底层运行原理
2021/06/21 Java/Android
解决SpringBoot文件上传临时目录找不到的问题
2021/07/01 Java/Android