0

YouTubeプレーヤーをhtmlページに埋め込もうとしている次のコードがあります。

コンソールにエラーは表示されませんが、html ページにプレーヤーが追加されません。

 <form name="urlReaderForm"  onSubmit=" return validateForm()" method="post">
    Url: <input type="text" name="url"><br>
   edit: Times: < input type="Number" name="times"<br>
    <input type="submit" type="submit" value="Submit">
 </form>
 <div id="youPlayer"></div>

<script>
    function validateForm() {
         var url=document.forms["urlReaderForm"]["url"].value;
         var loopCounter=document.forms["urlReaderForm"]["times"].value;

         var len = url.length;
         var vIDpos=url.indexOf("v=");
         var vID=url.substring(vIDpos+2,len-1);
         alert(''+vID);
         var html_var='';
         html_var ="<object style='height: 390px; width: 640px'> <param name='movie'       value='https://www.youtube.com/v/'"+vID+"'?version=3&feature=player_embedded&loop='"+loopCounter+"'&playlist='"+vID+"'><param name='allowFullScreen' value='true'><param name='allowScriptAccess' value='always'><embed src='https://www.youtube.com/v/'"+vID+"'?version=3&feature=player_embedded&loop='"+loopCounter+"'&playlist='"+vID+"' type='application/x-shockwave-flash' allowfullscreen='true' allowScriptAccess='always' width='425' height='344'></object>​";
        document.getElementById("youPlayer").innerHTML = html_var; 
     }
</script>
4

2 に答える 2

1

上記のサンプルにはいくつかの問題があります...

  • var loopCounter=document.forms["urlReaderForm"]["times"].value;フォームに読み取るフィールドがありません
  • フォームから URL を抽出すると、最後の文字が取り除かれます。使用するvar vID=url.substring(vIDpos+2,len);
  • スクリプトの最後に追加return false; しない限り、ページがリロードされるため、エラーが表示されることはありません

より最新の iframe 埋め込みを使用することをお勧めしますが、それでもソリューションに固執する必要がある場合は、次のことを試してください。

    function validateForm()
    {
    var url=document.forms["urlReaderForm"]["url"].value;
    //var loopCounter=document.forms["urlReaderForm"]["times"].value;
    loopCounter = 0;
    var len = url.length;
    var vIDpos=url.indexOf("v=");
    var vID=url.substring(vIDpos+2,len);
    alert(''+vID);
    var html_var='';
    html_var ="<object style='height: 390px; width: 640px'><param name='movie' value='https://www.youtube.com/v/"+vID+"?version=3&feature=player_embedded&loop='"+loopCounter+"'&playlist='"+vID+"'><param name='allowFullScreen' value='true'><param name='allowScriptAccess' value='always'><embed src='https://www.youtube.com/v/"+vID+"?version=3&feature=player_embedded&loop='"+loopCounter+"'&playlist='"+vID+"' type='application/x-shockwave-flash' allowfullscreen='true' allowScriptAccess='always' width='425' height='344'></object>";
    console.log(html_var);   
    document.getElementById("youPlayer").innerHTML = html_var; 
    return false;
    }
于 2012-12-25T18:23:14.610 に答える