博客园怎么实现代码运行

博客园怎么实现代码运行？

效果如下：

试试

 

1、上传脚本文件：点击管理按钮-->>找到下面界面，上传js文件

 

2、引入外部javascript：单击上传成功的文件名，复制url上的地址，就可以直接在html中引用（类似与在线CDN），然后点击设置，找到下面界面引入js：

 引入成功后，回微博首页，右击查看源码，可以看到下面（所以在编辑状态下还是无法运行js，保存后可以运行按钮）

3.在编辑窗口找到下面按钮插入代码即可；

参考代码如下：

<textarea style="margin: 0px; height: 70px; width: 600px;">试试</textarea>
<div>
<input class="button1" onclick="runCode(0)" type="button" value="运行代码" /> 
<input class="button2" onclick="saveCode(0)" type="button" value="保存代码" />
 <input class="button3" onclick="copyCode(0)" type="button" value="复制代码" />
</div>

 js代码如下：

function runCode(num){
    var obj=document.getElementsByTagName("textarea");   
    for(var i=0;i<obj.length;i++){   
        if(num==i){   
            var newWin=window.open('',"_blank",'');   
            newWin.document.open('text/html','replace');   
            newWin.opener=null  
            var testCode=obj[num].value;   
            newWin.document.write(testCode);   
            newWin.document.close();   
        }                  
    }   
}   
/*****保存代码为html页面，现阶段只支持IE******/  
//firefox不兼容的主要原因就是因为ff不支持execCommand('saveas','','filename');         
function saveCode(num){   
    var obj=document.getElementsByTagName("textarea");   
    for(var i=0;i<obj.length;i++){   
        if(num==i){   
            var newWin=window.open('','_blank','top=10000');   
            newWin.document.open('text/html','replace');   
            var testCode=obj[num].value;   
            newWin.document.write(testCode);   
            newWin.document.execCommand('saveas','','code.htm');   
            newWin.close();   
        }   
    }   
}   
function copyCode(num){   
    var obj=document.getElementsByTagName("textarea");   
    for(var i=0;i<obj.length;i++){   
        if(num==i){        
            var testCode=obj[num].value;   
            if(copy2Clipboard(testCode)!=false)   
            {   
                alert("生成的代码已经复制到粘贴板，你可以使用Ctrl+V 贴到需要的地方去了哦！  ");   
            }   
        }   
    }   
}   
copy2Clipboard=function(txt){   
    if(window.clipboardData){   
        window.clipboardData.clearData();   
        window.clipboardData.setData("Text",txt);   
    }   
    else if(navigator.userAgent.indexOf("Opera")!=-1){   
        window.location=txt;   
    }   
    else if(window.netscape){   
        try{netscape.security.PrivilegeManager.enablePrivilege(   
"UniversalXPConnect");   
    }   
    catch(e){   
        alert("您的firefox安全限制限制您进行剪贴板操作，请打开’about:config’将signed.applets.codebase_principal_support’设置为true’之后重试");   
        return false;   
    }   
    var clip=Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);   
    if(!clip)   
    return;   
    var trans=Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);   
    if(!trans)   
    return;   
    trans.addDataFlavor('text/unicode');   
    var str=new Object();   
    var len=new Object();   
    var str=Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);   
    var copytext=txt;str.data=copytext;trans.setTransferData("text/unicode",str,copytext.length*2);   
    var clipid=Components.interfaces.nsIClipboard;if(!clip)   
    return false;   
    clip.setData(trans,null,clipid.kGlobalClipboard);   
    }   
}

 

 以上是参考后运行成功的例子，欢迎一起交流！！！！

最后还有一个问题：textarea标签直接插入js代码会被注释掉，不知道有什么方法解决，欢迎留言。