使用包含腳本的長塊動態更改div的源/內容

我已經看到很多問題&有關類似問題的答案，但是我沒有找到有關此特定情況的答案。使用包含腳本的長塊動態更改div的源/內容

我有一個<div>在我動態顯示數據到一個圖形的網頁，它需要JavaScript到<div>（使用dygraph庫）。我想實現一個複選框來更改圖形代碼和代碼之間的<div>的內容，以顯示實時攝像頭連接，這也需要腳本。

我試圖與innerHTML和基於實例的jQuery功能我已經找到了，但他們都被稱爲無腳本內容非常簡單的HTML的變化，比較複雜，我發現是如何變化的圖片插入<div>內容。我讀過<div>不支持src屬性，其他論壇說是的，在我的情況下它沒有工作。圖書館div-src.js，也不適用於這種情況。

另一個企圖是與標籤已經工作，但頁面不能正常工作，去不穩定，特別是WebSocket連接。 Eclipse會顯示一條警告，指出「未知標籤」，並且我已閱讀過已在HTML5中過時。

我想用jQuery執行此操作，但知道沒有成功。

什麼是最好的方法動態插入到一個<div>長的HTML代碼塊與腳本，調用js庫？

<input type="radio" name="radiobutton" value="graph" onClick="changeDivContent()"> 
<input type="radio" name="radiobutton" value="video" onClick="changeDivContent()"> 

<div id="graph-video"> 
--- Block with HTML, nesting divs and javascript --- 
</div>

注：使用jQuery我曾嘗試使用.load功能：

$("#graph-video").load("video.jsp"); 
$("#graph-video").load("graphic.jsp");

與結果：代碼爲圖形產生故障和WebSocket的接近。

來源

2014-07-13 Alf

最後它工作。感謝下面的評論。我使用「.load（）」函數。方法是從每個jsp文件（視頻和圖形）中提取所有javascript代碼/函數。然後我將JavaScript函數放在一個js文件中，並通過主頁面對此文件進行收費。以這種方式運行。 – Alf

試試這個

function changeDivContent() { 
    $('#graph-video').html('<iframe width="420" height="345"src="http://www.youtube.com/embed/XGSy3_Czz8k"></iframe>)'); 
}

或外部HTML文件

$('#graph-video').load('external_file.htm');

來源

2014-07-13 11:21:27 cizzbar

我看到它，你有各種問題的方式。首先是動態加載js文件。爲此，您必須將它們添加爲DOM對象，而不是內部HTML。爲了達到目的，您可以使用此功能：

function loadjscssfile(filename, filetype){ 
if (filetype=="js"){ //if filename is a external JavaScript file 
    var fileref=document.createElement('script') 
    fileref.setAttribute("type","text/javascript") 
    fileref.setAttribute("src", filename) 
} 
else if (filetype=="css"){ //if filename is an external CSS file 
    var fileref=document.createElement("link") 
    fileref.setAttribute("rel", "stylesheet") 
    fileref.setAttribute("type", "text/css") 
    fileref.setAttribute("href", filename) 
} 
if (typeof fileref!="undefined") 
    document.getElementsByTagName("head")[0].appendChild(fileref) 
}

取自here。

至於div內的圖片，它很大程度上取決於您所指圖片的類型。

<img>一個<div>內：

$（ 'img_selector_here'）ATTR（「SRC」，newSrc）;一個<div>的
背景屬性：

$（ 'div_selector'）。CSS（ '背景圖像'， 'URL（img_url）'）;
<canvas>元素，就像dygraph產生的一個：找到適合您的具體需要一個很好的教程，你可以通過查看here，因爲canvas元素提供噸的繪製和重繪選項啓動。

來源

2014-07-13 12:10:37

使用包含腳本的長塊動態更改div的源/內容

回答

相關問題