[原创]使用runcode运行HTML代码 for D4

★功能说明：
大家都知道论坛里代码标签是code，但这个只能显示及复制代码，却不能即时测试HTML（比如JS特效），论坛里有人发过“增强的code]代码插件，但是那样的话，有些不需要”运行“的HTML就无法更直观显示了。所以我利用D4的自定义标签功能增加了[runcode][/runcode]代码，可以与code]标签同时使用。其最主要的作用就是测试一些HTML代码效果，比如CSS，JS等

★安装难度：极易

★数据库升级：无

★系统安全：低，只能运行客户端代码，不能运行服务器端代码

★示例：http://www.i79.cn/bbs/viewthread.php?tid=1016

★操作步骤：
（1）修改/include/common.js
（2）后台增加Discuz!代码[runcode]，并启用

★使用方法：
发布代码时，在代码头尾写上[runcode这里写的是HTML代码[/runcode]
★详细步骤：

第一步：编辑/include/common.js

查找

1. function copycode(obj) {
   
2.         var rng = document.body.createTextRange();
   
3.         rng.moveToElementText(obj);
   
4.         rng.scrollIntoView();
   
5.         rng.select();
   
6.         rng.execCommand("Copy");
   
7.         rng.collapse(false);
   
8. }
   

复制代码

替换

1. function copyCode(obj) {
   
2. var rng = document.body.createTextRange();
   
3. rng.moveToElementText(obj);
   
4. rng.scrollIntoView();
   
5. rng.select();
   
6. rng.execCommand("Copy");
   
7. rng.collapse(false);
   
8. }
   
9. 
   
10. function runCode(obj) {
    
11. var winname = window.open('', "_blank", '');
    
12. winname.document.open('text/html', 'replace');
    
13. winname.document.writeln(obj.value);
    
14. winname.document.close();
    
15. }
    
16. 
    
17. function saveCode(obj) {
    
18. var winname = window.open('', '_blank', 'top=10000');
    
19. winname.document.open('text/html', 'replace');
    
20. winname.document.writeln(obj.value);
    
21. winname.document.execCommand('saveas','','code.htm');
    
22. winname.close();
    
23. }

复制代码

第二步：进入论坛管理后台，添加Discuz!代码[runcode]

标签:runcode
替换内容:

1. <br><textarea name='FF0' rows="15" cols="95">{1}</textarea><br><input type="button" value="运行代码" onclick="runCode(FF0)"> <input type="button" value="复制代码" onclick="copyCode(FF0)"> <input type="button" value="另存代码" onclick="saveCode(FF0)"> <script language=JavaScript>ffcod=delpost.FF0.value;ffcod=ffcod.replace(/<br \/>/g,'');delpost.FF0.value=ffcod;</script>提示：你可以先修改部分代码再运行<br>

复制代码

例子:[runcode运行网页代码[/runcode]
解释:添加运行代码功能
参数个数:1
嵌套次数:1

第三步：启用[runcode]标签

[ 本帖最后由 wgding 于 2006-2-6 16:57 编辑 ]

注意，如果大家启用runcode后没有效果，那可能是因为你没有对用户组设定
只有在用户组权限设定中，将“允许使用自定义 Discuz! 代码”打开时，该组用户所发表的包含自定义 Discuz! 代码的内容才会被解析。

占各位

这个功能确实不错

运行的~？

对，可以直接运行HTML代码，并且可以在代码窗口实时修改并调试结果

嘻嘻,,非常喜欢这个~~!!!感谢

不错的东西

站位。。廣告。。支持。。

收藏~