在做爱易学习网论坛http://bbs.aiyiweb.com时,需要给帖子加入脚本运行框的代码.相关的资料还是很难找.

DZ官方论坛不提供相关的脚本运行框插件,网上公开的也只有PHP版的解决方法,而且还有很多问题.

研究了半天,终于找到解决方法,最终实现的效果如下,可以支持多个脚本运行框:

经过全面调试,完全支持所有脚本调试功能.

方法如下:

1、进入DZ！NT后台>>贴子>>贴子相关Discuz!NT 代码，设置如下图并保存：

替换内容是：

<TEXTAREA id="{RANDOM}" rows="12" cols="95">{1}</TEXTAREA><br><INPUT onclick=runEx("{RANDOM}") type="button" value="运 行"/> <INPUT onclick=doCopy("{RANDOM}") type="button" value="复 制" /> <INPUT  class="submit1" onclick=doSave("{RANDOM}") type="button" value="保 存" /> 提示：可先修改代码再按运行
 

2、修改论坛根目录下的javascript/common.js，在最未尾加入如下脚本代码：

//运行代码
function runEx(cod1)  {
  cod=document.getElementById(cod1)
   var code=cod.value;
   if (code!=""){
    var newwin=window.open('','',''); 
    newwin.opener = null
    newwin.document.write(code); 
    newwin.document.close();
 }
}
//复制代码
function doCopy2(ID) {
 if (document.all){
   textRange = document.getElementById(ID).createTextRange();
   textRange.execCommand("Copy");
alert('复制成功');
 }
 else{
   alert("此功能只能在IE上有效")
 }
}
//复制代码
function doCopy(obj) {
 var rng = document.body.createTextRange();
 rng.moveToElementText(obj);
 rng.scrollIntoView();
 rng.select();
 rng.execCommand("Copy");
 rng.collapse(false);
}

function doCopyUrl()
{
document.getElementById("CopyUrl").value=parent.location.href;
document.getElementById("CopyUrl").select();
document.execCommand("copy");
alert("网址成功复制到剪贴板！")
}

//另存代码
function doSave(obj) {
 var winname = window.open('', '_blank', 'top=10000');
 winname.document.open('text/html', 'replace');
 winname.document.writeln(obj.value);
 winname.document.execCommand('saveas','','code.htm');
 winname.close();
}

通过以上两步就可以实现代码运行框的效果了，最后添加测试：

通过以上的步骤就可以轻松实现了。

本文为爱易学习网Web开发之家原创，转载请注明来自www.aiyiweb.com。