2011-03-07 109 views
1

我更新上一個JavaScript前端播放YouTube視頻(使用嵌入YouTube)DOM對象。如何更新DOM是嵌入YouTube視頻,而該視頻被播放?

現在,我希望在DOM對象更新後立即刷新頁面: 我更新了視頻源(URL),並且希望當前視頻停止,並且新視頻立即開始播放。

我使用

document.getElementById("embed_id").src=newUrl.fetch_url; 

其中:

「embed_id」:是我給的YouTube-嵌入對象的元素中的id;

源:是它需要的源URL參數發揮

newUrl.fetch_url:內部參數包含了新的視頻網址

目前發生的事情是,當我看的Javascript調試器,我可以看到元素和src值已更新,但原始視頻仍在播放。我如何讓DOM刷新以便新視頻開始播放?

回答

0

所以最終我沒更新,但附加了新的元素:

var body = document.getElementById('body'); 
var newObject = currentObject.cloneNode(true); 
newObject.childNodes[1].setAttribute('value',"http://www.youtube.com/v/"+newUrl.fetch_url+"?enablejsapi=1&version=3&autohide=1&showinfo=0?fs=1&autoplay=1"); 
$('body').append(newObject).hide().fadeIn(10000); 

我用的childNodes [I] .setAttribute()去更新正確的地方。

正如@Myles說我不能找到一種方法來實時更新的DOM,但這種附加後,我將刪除舊的對象。

1

好了,你想要做的是一樣的東西:

var embedded = document.getElementById("embed_id"); 
while (embedded.hasChildNodes()) { 
    embedded.removeChild(embedded.firstChild); 
} 
//Re-run DOM insertion here. 

這將刪除所有embedded的孩子的,讓你重新插入YouTube的嵌入新的URL。

更新

這有效地 '接觸' 的DOM元素,應該是你在找什麼...

var other = element.nextSibling; 

if (other) { 
    other.parentNode.removeChild(element); 
    other.parentNode.insertBefore(element,other); 
} else { 
    other = element.parentNode; 
    other.removeChild(element); 
    other.appendChild(element); 
} 

Source

+0

謝謝!事情是,我would'nt不想失去前者目標代碼,只需改變一個參數(新的URL)。我在刪除它之前如何獲取它,以便我可以使用它進行更新? – 2011-03-08 06:50:15

+0

@Hamutsi見上:) – 2011-03-08 06:51:57

+0

見,我不想刪除/追加孩子的,但我想更新** **屬性「SRC」 – 2011-03-08 07:57:28