PHPでAJAXを使用するとエラーが発生する

Question

私は初心者です。

ファイルPHP：

<div class="video" id="result"></div> 
<script 
    src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script type="text/javascript"> 
    $.ajax({ 
     type: 'POST', 
     url: 'player.php', 
     data: { 
      id: 'http://youtube.com/watch?v=fY7RT9_QM1a' 
     }, 
     dataType: 'html', 
     success: function(data) { 
      $("#result").html(data); 
     }, 
     error: function() { 
      alert('error'); 
     } 
    }); 
</script> 

ファイルPHP：

function Demoplugin_jw($link) { 
 
\t $Demoplayer .= " 
 
\t <script type='text/javascript' src='".plugins_url(
 
         'player/Jwplayer7/jwplayer.js', __FILE__)."'></script> 
 
\t <div id='jw'></div> 
 
     <script type='text/javascript'> 
 
\t \t jwplayer('jw').setup({ 
 
\t \t \t primary: 'html5', 
 
\t \t \t width: '100%px', 
 
\t \t \t height: '100%px', 
 
\t \t \t aspectratio: '16:9', 
 
\t \t \t skin: 'bekle', 
 
\t \t \t sources: ".Demoplugin($link)." 
 
     }) 
 
    </script>"; 
 
\t return $Demoplayer; 
 
} 
 
function Demoplugin($link){ 
 
    ..... 
 
    .... 
 
    $sources .= {file:"'.$value.'",type:"mp4",label:"'.$key.'"}; 
 
    $sources = '['.rtrim($sources, ',').']'; 
 
    return $sources; 
 
} 
 

 
if(isset($_POST['id'])) { 
 
\t echo Demoplugin_jw($_POST['id']); 
 
}

私は<div id="result">に機能Demoplugin_jwの結果を表示したい私は、次のコードを持っています。

しかし、私はエラーを取得：

alert("error") 

Answer 1

それは、JavaScriptのAPIであるため、これは簡単にJavaScriptで実現することができます。ここでは、YouTube v GETの値をdata属性に保存します。次に、ビデオを保持しているラップするdivにIDを割り当て、そのデータをIDとして使用して、1ページに複数のビデオを保存することができます。

$(function() { 
 
    $('.youtube-link').click(function() { 
 
    var wrapper = document.createElement('div'); 
 
    wrapper.id = $(this).attr('data'); 
 
    $(this).append(wrapper); 
 
    var $sources = { 
 
     file: 'http://youtube.com/watch?v=' + $(this).attr('data'), 
 
     type: 'mp4' 
 
    }; 
 
    jwplayer($(this).attr('data')).setup({ 
 
     primary: 'html5', 
 
     width: '100%px', 
 
     height: '100%px', 
 
     aspectratio: '16:9', 
 
     skin: 'bekle', 
 
     sources: $sources 
 
    }); 
 
    }); 
 
    $('.youtube-link').forEach(function($link) { 
 
     $($link.attr('data')).click(function() { 
 
      $(this).remove(); 
 
     }); 
 
    }); 
 
});

.youtube-link { 
 
    background: #efefef; 
 
    padding: 25px; 
 
    margin: 10px; 
 
    cursor: pointer; 
 
    width: 100px; 
 
    border: 1px solid #000; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!-- todo: add this link --> 
 
<script src="link_to_your_jwPlayer"></script> 
 

 
<div class="youtube-link" data="JzYRZygjJrI">Watch JzYRZygjJrI</div> 
 
<div class="youtube-link" data="wySpzs5S1Eg">Watch wySpzs5S1Eg</div>

私はjwplayer.jsファイルへのアクセス権を持っていないので、これは、コードをテストされていません。必要に応じてこれを変更してください。 PS - あなたはスタイリングを追加する必要があります。