在Z-Blog中运行代码[html][/html](纯JS版)


Posted in Javascript onMarch 25, 2007

昨天的《利用th,colgroup,col定义表格样式》中,细心点的朋友会发现加了一个“运行代码”的链接:直接点击可以运行Textarea中的内容。其实本身蓝色理想、51JS上也有相关介绍,Z-Blog官方论坛上也有类似帖子,因为自己不太喜欢改asp的内容(将来升级省得替换),所以偷了个小懒,做了一个纯JS版本的。
是否兼容FireFox,还没来得及测试。自己觉得“另存为”和“复制”功能也比较多余,这里也省略掉了。如果需要Fix Bug或者技术支持,欢迎给我留言^_^ 具体代码如下:

function RunCode() {  
  var ele = document.getElementsByTagName("textarea");  
  for (var i=0; i<ele.length; i++) {  
    with (ele[i]) {  
      if (className != "code") continue;  
      var o = document.createElement("p");  
      var a = document.createElement("a");  
      var em = document.createElement("em");  
      o.className = "runCode";  
      a.href = "javascript:;";  
      a.innerHTML = "运行代码";  
      a.onclick = function() {  
        var win = window.open('', "_blank", '');  
        win.document.open('text/html', 'replace');  
        win.document.writeln(this.parentNode.previousSibling.value.replace(/\u00a0/gi, " "));  
        win.document.close();  
      }  
      em.innerHTML = "(提示:您可以先修改部分代码再运行)";  
      o.appendChild(a);  
      o.appendChild(em);  
      insertAdjacentElement("afterEnd",o);  
    }  
  }  
} 

目前“运行代码”功能是放在Textarea下方的,如果想放在上方,改动以下代码即可。
insertAdjacentElement("afterEnd",o);
this.parentNode.previousSibling.value
其中的replace(/\u00a0/gi, " ")主要是为了将被c_function.asp文件替换的空格( )和Tab(  )还原回来。使用方面当然是在所需页面onload进来即可,有多少个className为code的Textarea,就有多少个“运行代码”功能,够简单吧?
Javascript 相关文章推荐
通过JAVASCRIPT读取ASP设定的COOKIE
Nov 24 Javascript
JS提交并解析后台返回的XML的代码
Nov 03 Javascript
JS option location 页面跳转实现代码
Dec 27 Javascript
js时间日期和毫秒的相互转换
Feb 22 Javascript
一个Action如何调用两个不同的方法
May 22 Javascript
JavaScript模拟可展开、拖动与关闭的聊天窗口实例
May 12 Javascript
jQuery css() 方法动态修改CSS属性
Sep 25 Javascript
Angular和百度地图的结合实例代码
Oct 19 Javascript
Angular.js之作用域scope'@','=','&amp;'实例详解
Feb 28 Javascript
vue树形结构获取键值的方法示例
Jun 21 Javascript
webpack file-loader和url-loader的区别
Jan 15 Javascript
Easyui 关闭jquery-easui tab标签页前触发事件的解决方法
Apr 28 jQuery
JavaScript判断两种格式的输入日期的正确性的代码
Mar 25 #Javascript
表单(FORM)的一些实用效果代码
Mar 25 #Javascript
推荐dojo学习笔记
Mar 24 #Javascript
利用Dojo和JSON建立无限级AJAX动态加载的功能模块树
Mar 24 #Javascript
tbody元素支持嵌套的注意方法
Mar 24 #Javascript
xml 与javascript结合的问题解决方法
Mar 24 #Javascript
用prototype实现的简单小巧的多级联动菜单
Mar 24 #Javascript
You might like
怎样在PHP中通过ADO调用Asscess数据库和COM程序
2006/10/09 PHP
laravel 5 实现模板主题功能
2015/03/02 PHP
PHP获取音频文件的相关信息
2015/06/22 PHP
PHP MYSQL简易交互式站点开发
2016/12/27 PHP
PHP编程文件处理类SplFileObject和SplFileInfo用法实例分析
2017/07/22 PHP
javascript getElementsByClassName 和js取地址栏参数
2010/01/02 Javascript
Javascript(AJAX)解析XML的代码(兼容FIREFOX/IE)
2010/07/11 Javascript
jQuery实现form表单reset按钮重置清空表单功能
2012/12/18 Javascript
javascript中闭包(Closure)详解
2016/01/06 Javascript
JS定义类的六种方式详解
2016/05/12 Javascript
原生javascript实现读写CSS样式的方法详解
2017/02/20 Javascript
jQuery实现checkbox即点即改批量删除及中间遇到的坑
2017/11/11 jQuery
vue项目base64字符串转图片的实现代码
2018/07/13 Javascript
微信小程序项目实践之九宫格实现及item跳转功能
2018/07/19 Javascript
AngularJS实现与后台服务器进行交互的示例讲解
2018/08/13 Javascript
js自定义input文件上传样式
2018/10/26 Javascript
详解Vue项目部署遇到的问题及解决方案
2019/01/11 Javascript
javascript关于“时间”的一次探索
2019/07/24 Javascript
Python中使用PIPE操作Linux管道
2015/02/04 Python
探究Python的Tornado框架对子域名和泛域名的支持
2015/05/02 Python
python操作 hbase 数据的方法
2016/12/18 Python
利用python循环创建多个文件的方法
2018/10/25 Python
python 使用re.search()筛选后 选取部分结果的方法
2018/11/28 Python
Python sep参数使用方法详解
2020/02/12 Python
Python Django中间件使用原理及流程分析
2020/06/13 Python
Python 多线程C段扫描、检测 Ping扫描脚本的实现
2020/09/03 Python
python温度转换华氏温度实现代码
2020/12/06 Python
ANINE BING官方网站:奢华的衣橱基本款和时尚永恒的单品
2019/11/26 全球购物
试用期自我鉴定范文
2014/03/20 职场文书
计算机求职自荐信范文
2014/04/19 职场文书
健康教育评估方案
2014/05/25 职场文书
司法所长先进事迹
2014/06/02 职场文书
乡镇创先争优活动总结
2014/08/28 职场文书
canvas多重阴影发光效果实现
2021/04/20 Javascript
python实现简单的井字棋
2021/05/26 Python
Nginx配置之实现多台服务器负载均衡
2021/08/02 Servers