PHP内でJavaScript変数を使用するには？

Question

私は現時点でYouTubeのチャンネルからビデオ情報を取り出したシンプルなFacebookアプリを持っています。

YouTubeの返信の最初の動画をタイトル、再生回数、説明とともにプレースホルダに埋め込み、すべての動画（最初の動画を含む）が埋め込み動画を保持するdivの下に表示されます。

次に、ユーザーがビデオサムネイルのいずれかをクリックすると、そのビデオはプレースホルダdivに埋め込まれます。

YouTube連想配列内の動画のIDをハードコードすることでこれを動作させることはできますが、id変数をPHPの最後の行に使用する方法を見つけることはできません。

は、ここに私の現在のコードです：テキスト（とインラインCSS）の壁のための

$url = 'http://gdata.youtube.com/feeds/api/videos?max-results=20&alt=jsonc&orderby=published&format=5&safeSearch=none&author=CHANNELID&v=2'; 
$ch = curl_init(); 
curl_setopt($ch, CURLOPT_URL, $url); 
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); 
curl_setopt($ch, CURLOPT_REFERER, $url); 
$body = curl_exec($ch); 
curl_close($ch); 
$data = json_decode($body, true); 

?> 
<div id="placeholder" style="font-family:Helvetica; max-width:500px; margin:0 0 20px 0;"> 
<div id="player"><iframe width="480" height="274" src="https://www.youtube.com/embed/<?php echo $data['data']['items'][0]['id']; ?>" frameborder="0" allowfullscreen></iframe></div> 
<div class="title" style=" font-size:14px; font-weight:bold; color:#3B5998; margin:2px 0 3px 0;"><?php echo $data['data']['items'][0]['title']; ?> </div> 
<div class="views" style="color:#BBB; font-size:12px;"><?php echo $data['data']['items'][0]['viewCount'];?> views</div> 
<div class="description" style="font-size:14px;"><?php echo $data['data']['items'][0]['description'];?></div> 
<div class="hr" style="padding:5px 0 0 0; float:left; border-bottom: 1px solid #96CC90; width:480px;"></div> 
</div> 
<?php 

foreach($data['data']['items'] as $item) { 
$id = $item['id']; 
$description = $item['description']; 
$description = str_replace('uk.opticalexpress.com', '', $description); 
$description = str_replace('-', '', $description); 
$description = trim($description); 

$thumb = $item['thumbnail']['sqDefault']; 

$i = 0; 
?> 
<div class="video" id="<?php echo $i; ?>" style="font-family:Helvetica; float:left; max-width:150px; min-height:130px; margin:0 0px 20px 10px;"> 
    <div class="thumb" style="position:relative; left:0; top:0;"> 
     <img src="<?php echo $item['thumbnail']['sqDefault'];?>" title="<?php echo $description;?>" style="position:relative; top:0; left:0px;"/> 
     <img src="../images/play-thumb.png" style="position:absolute; top:30px; left:45px;"/> 
    </div> 
    <div class="title" style="font-size:14px; font-weight:bold; color:#3B5998; margin:2px 0 3px 0;"><?php echo $item['title']; ?> </div> 
    <div class="views" style="font-size:12px;"><?php echo $item['viewCount'];?> views</div> 
</div> 

<?php 
$i++; 
} 
?> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
    $('.video').click(function() { 
     var id = $(this).attr('id'); 

     $('#placeholder').fadeOut('slow'); 
     $('#placeholder').html('<div id="player"><iframe width="480" height="274" src="https://www.youtube.com/embed/<?php echo $data['data']['items'][1]['id']; ?>" frameborder="0" allowfullscreen></iframe></div>'); 
     $('#placeholder').fadeIn('slow'); 
    }); 
}); 
</script> 

申し訳ありません！

Answer 1

難しい...私はjQueryで.videoのclickイベントを見て、次にiframeに必要なHTMLを生成するサーバー（RESTish）のPHPファイルにGETリクエストを行い、あなたが今受け取ったhtmlへのビデオhtml。 ...

もう一つの可能​​性は、すべてのiframeを読み込んでから.videoをクリックするだけで、同じ一意のIDまたは何かに一致するものを表示することです。これは、AJAX型のアプローチに最も適した、ユーザーにとってより多くの読み込み時間を意味します。

Answer 2

これを行うことでajaxを使用することができます。私はこのようにしています。これもあなたのために働くことを願っています。

<div id="video1" class=".temp"></div> 

<script type="text/javascript"> 

$(document).ready(function() { 
    $('.temp').click(function() { 

     var currentId = $(this).attr('id'); 
     showVideo(currentId); 
    }); 
}; 

function showVideo(str) 
{ 

    if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
     xmlhttp=new XMLHttpRequest(); 
    } 
    else 
    {// code for IE6, IE5 
     xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlhttp.onreadystatechange=function() 
    { 
     if (xmlhttp.readyState==4 && xmlhttp.status==200) 
     { 
      document.getElementById("VideoFrameDiv").innerHTML=xmlhttp.responseText; 
     } 
    } 
    xmlhttp.open("GET","inc/AjaxOnClickValues.php?id="+str,true); 
    xmlhttp.send(); 
} 
</script>