将vimeo链接转换为keyup上的嵌入视频

时间:2011-07-22 09:51:55

标签: jquery

我在这个网站上找到了一些脚本并将它们组合在一起,结果是http://jsfiddle.net/mortenhauberg/XyCec/

它将Youtube链接转换为视频。我如何使用Vimeo链接做同样的事情?

代码可能非常混乱和丑陋,但我是这个jquery-thing的新手,只是想学习:)

1 个答案:

答案 0 :(得分:0)

我把它放在那个和演示之间的所有内容上,一切都应该很清楚。

Live demo here (click).

<!-- this is where you can put the url that will be loaded into the iframe -->
<input id="vimeoInput" type="text" placeholder="Vimeo video url">
<!-- make a video from a url by adding the "src" to this iframe -->
<iframe id="vimeoFrame" src=""></iframe>

的javascript:

/* get element references */
var vimeoFrame = document.getElementById('vimeoFrame');
var vimeoInput = document.getElementById('vimeoInput');
var vimeoUrlList = document.getElementById('vimeoUrlList');

function updateIframe() {
  if (this.value) { //if the input isn't empty
    vimeoFrame.src = this.value; //add the value as the iframe source
    vimeoFrame.style.display = 'block'; //show iframe
  }
  else { //no input value
    vimeoFrame.style.display = 'none'; //hide iframe
  }
}

vimeoInput.addEventListener('keyup', updateIframe); //when typing in the input, run updateIframe function