2012-02-27 48 views
0

我正在構建使用AJAX的<div>元素,並且我想添加ZeroClipboard功能。 Firebug顯示代碼構建正確,當我將它複製到原始HTML測試頁面時,它也可以工作。這些構建不是在onload上發生,而是在賽道上。innerHTML在主體中插入腳本(對於ZeroClipboard)不起作用

的代碼如下,調用,創造了新的元素一些功能:

dom_append_child_with_onclick ("img",export_id,"icon_active",report_heading_id, "event.cancelBubble = true;"); 
dom_append_child ("div",export_script_id,"",report_heading_id); 
text = "<script language='JavaScript'>var clip" +rnum +"=new ZeroClipboard.Client();clip"+rnum+".setText('');clip"+rnum+".addEventListener('mouseDown',function(client){alert('firing');clip"+rnum+".setText(document.getElementById('SL40').value);});clip"+rnum+".glue('XR"+rnum+"','RH"+rnum+"');</script>"; 
document.getElementById(export_script_id).innerHTML=text; 

我的問題:當您插入腳本到<body>,你必須做一些事情來得到它的火?該腳本似乎沒有做它的事情,我不能得到警報「解僱」顯示。

注意:cancelBubble是停止底層元素的onClick函數。如果我能夠使閃光燈工作,可能沒有必要。

謝謝。

回答

1

您可以直接注入腳本到頁面的DOM對象,但是這並不在所有的瀏覽器:

var s = document.createElement("script"); 
s.type = "text/javascript"; 
s.innerText = "var clip" +rnum +"=new ZeroClipboard.Client();clip"+rnum+".setText('');clip"+rnum+".addEventListener('mouseDown',function(client){alert('firing');clip"+rnum+".setText(document.getElementById('SL40').value);});clip"+rnum+".glue('XR"+rnum+"','RH"+rnum+"');"; 
document.getElementsByTagName("head")[0].appendChild(s); 

或者,爲了更好的兼容性,你可能只想宣佈,其設定的功能這在你的頁面中,然後以rnum作爲參數調用函數。

例如

function useZeroClipboard(rnum) { 
    window["clip" + rnum] = new ZeroClipboard.Client(); 
    cwindow["clip" + rnum].setText(''); 
    window["clip" + rnum].addEventListener('mouseDown', function(client){ 
     alert('firing'); 
     window["clip" + rnum].setText(document.getElementById('SL40').value); 
    }); 
    window["clip" + rnum].glue('XR"+rnum+"','RH"+rnum+"'); 
} 

然後,你可以調用你的代碼:

useZeroClipboard(rnum); 

而是寫劇本塊。

+0

感謝這一點,亞當。我已經穩步地認識到我所問過的錯誤問題。它慢慢地讓我意識到,從已經運行的腳本插入腳本(使用innerHTML)沒有意義,並且可以做我需要做的事情。實際上,我的解決方案一直是按照你的功能想法所建議的。我創建了一個全局數組o,然後使用o [rnum] = new ZeroClipboard.Client();等等在我的解決方案中使用window [「clip」+ rnum]會有好處嗎? – Nick 2012-02-27 10:33:52

+0

不,你的新解決方案更好(比編號的全局變量更容易使用數組!) – 2012-02-28 01:19:14

+0

謝謝,亞當。 --- – Nick 2012-02-28 06:21:21

0

這裏是一個遞歸地執行替換原有的所有腳本的方法:

function replaceScriptsRecurse(node) {              
     if (nodeScriptIs(node)) {               
       var script = document.createElement("script");        
       script.text = node.innerHTML;            

       node.parentNode.replaceChild(script, node);         
     }                     
     else {                    
       var i  = 0;               
       var children = node.childNodes;            
       while (i < children.length) {            
         replaceScriptsRecurse(children[i]);        
         i++;                 
       }                   
     }                     

     return node;                   
}                       
function nodeScriptIs(node) {                
     return node.getAttribute && node.getAttribute("type") == "text/javascript";   
}