HTML输入并使用用户输入创建iFrame URL？

问题描述：

我怎样才能把我下面的提示，使用什么类型的用户进入提示，把它变成一个iFrame的网址，如下所示：HTML输入并使用用户输入创建iFrame URL？

<iframe src="http://www.weather.com" sandbox="" seamless="" width="100%" height="200 </iframe> 


<html> 
<head> 
<script> 
function disp_prompt() 
{ 
var sitename=prompt("Please enter your Website:","www.anywebsite.com") 
document.getElementById("msg").innerHTML="Your Site: " + sitename 
} 
</script> 
</head> 
<body> 

<input type="button" onclick="disp_prompt()" value="Click to enter in Website URL"> 
<br><br> 

<div id="msg"></div> 

</body> 
</html>

你需要完全创建一个iframe元素，或者只是替换现有的scr attr？ – 2013-02-16 22:13:27

只是替换现有的SCR attr并提交给服务器。我也试过使用

– user2079297 2013-02-16 22:34:22

src =）.............. – 2013-02-16 22:51:08

答

<html> 
<head> 
<body> 

<iframe id="iframeID" src="http://www.weather.com" sandbox="" seamless="" width="100%" height="200"></iframe> 
    <form name="FormInput" action="" method="get" id="input" onsubmit="document.getElementById('iframeID').src=document.FormInput.site.value;"> 
Website URL: 
<input type="text" name="site"/> 
<br/> 
<br/> 
<input type="submit" value="Submit"/> 
<br/> 
</form> 


<div id="msg"></div> 

</body> 
</html>

答

作品在Youtube，Vimeo的

希望它可以帮助：

click here to run the script

function createIFrame(url, width, height){ 

switch(url.substring(7,12)){ 
    case "www.y": 
     return url.replace(/(?:http:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?(.+)/g, '<iframe width="'+width+'" height="'+height+'" src="http://www.youtube.com/embed/$1" frameborder="0" allowfullscreen></iframe>');  
     break; 
    case "youtu": 
     return url.replace(/(?:http:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?(.+)/g, '<iframe width="'+width+'" height="'+height+'" src="http://www.youtube.com/embed/$1" frameborder="0" allowfullscreen></iframe>');  
     break; 
    case "vimeo": 
     return url.replace(/(?:http:\/\/)?(?:www\.)?(?:vimeo\.com)\/(?:\/\?)?(.+)/g, '<iframe width="'+width+'" height="'+height+'" src="http://player.vimeo.com/video/$1" frameborder="0" allowfullscreen></iframe>'); 
     break; 
}

}

HTML输入并使用用户输入创建iFrame URL？

相关推荐