纯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 &amp;&amp;和||运算法的另类使用技巧
Nov 28 Javascript
利用jQuery接受和处理xml数据的代码(.net)
Mar 28 Javascript
鼠标焦点离开文本框时验证的js代码
Jul 19 Javascript
jQuery动态显示和隐藏datagrid中的某一列的方法
Dec 11 Javascript
jQuery之ajax删除详解
Feb 27 Javascript
javascript引擎长时间独占线程造成卡顿的解决方案
Dec 03 Javascript
最新最热最实用的15个jQuery插件汇总
Jul 05 Javascript
bootstrap实现弹窗和拖动效果
Jan 03 Javascript
BootStrap glyphicon图标无法显示的解决方法
Sep 06 Javascript
微信小程序 图片上传实例详解
May 05 Javascript
React进阶学习之组件的解耦之道
Aug 07 Javascript
Vue中正确使用Element-UI组件的方法实例
Oct 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列出mysql表所有行和列的方法
2015/03/13 PHP
PHP通过反射动态加载第三方类和获得类源码的实例
2015/11/27 PHP
Thinkphp框架中D方法与M方法的区别
2016/12/23 PHP
js字符编码函数区别分析
2011/12/28 Javascript
jquery easyui 对于开始时间小于结束时间的判断示例
2014/03/22 Javascript
jQuery表格列宽可拖拽改变且兼容firfox
2014/09/03 Javascript
jQuery实现拖动调整表格单元格大小的代码实例
2015/01/13 Javascript
自定义百度分享的分享按钮
2015/03/18 Javascript
javascript实现五星评价代码(源码下载)
2015/08/11 Javascript
浅析在javascript中创建对象的各种模式
2016/05/06 Javascript
解决jQuery ajax请求在IE6中莫名中断的问题
2016/06/20 Javascript
谈谈PHP中相对路径的问题与绝对路径的使用
2016/08/16 Javascript
DWR3 访问WEB元素的两种方法实例详解
2017/01/03 Javascript
微信小程序 WebSocket详解及应用
2017/01/21 Javascript
js for循环倒序输出数组元素的实例
2017/03/01 Javascript
一个可复用的vue分页组件
2017/05/15 Javascript
js模块加载方式浅析
2017/08/12 Javascript
详解Vue双向数据绑定原理解析
2017/09/11 Javascript
vue + elementUI实现省市县三级联动的方法示例
2019/10/29 Javascript
Vue单页面应用中实现Markdown渲染
2021/02/14 Vue.js
Python中用sleep()方法操作时间的教程
2015/05/22 Python
浅谈Python中用datetime包进行对时间的一些操作
2016/06/23 Python
django开发教程之利用缓存文件进行页面缓存的方法
2017/11/10 Python
Python基于Tkinter模块实现的弹球小游戏
2018/12/27 Python
Python实现二维曲线拟合的方法
2018/12/29 Python
Django为窗体加上防机器人的验证码功能过程解析
2019/08/14 Python
CSS3实现简易版的刮刮乐效果
2016/09/27 HTML / CSS
HTML5之语义标签介绍
2016/07/07 HTML / CSS
英国Amara家居法国网站:家居装饰,现代装饰和豪华礼品
2016/12/15 全球购物
松本清官方海外旗舰店:日本最大的药妆连锁店
2017/11/21 全球购物
枚举和一组预处理的#define有什么不同
2016/09/21 面试题
什么是唯一索引
2015/07/05 面试题
银行优秀员工事迹
2014/02/06 职场文书
学生个人评语大全
2015/01/04 职场文书
教师见习总结范文
2015/06/23 职场文书
nginx.conf配置文件结构小结
2022/04/08 Servers