在使用iframe時遇到問題

Question

在使用iframe時我很失敗，我需要一些幫助。我從來沒有使用過iframe，這是我第一次。

這裏是什麼，我試圖按照生產與廣場滑塊iframe中doucment：http://galleria.io/docs/references/data/

我已經是一個jwplayer，我想訪問使用iframe來獲取視頻（S）這些視頻位於video.php頁面。如果只有一個視頻，那麼只需從video.php頁面檢索正確的視頻，但如果有多個視頻，則檢索正確的多個視頻並將其顯示在商業廣告滑塊中。但我的問題是如何讓iframe工作才能做到這一點？

下面是video.php頁面，它顯示jwplayer：

<div id="myElement-<?php echo $key.'-'.$i; ?>">Loading the player... 

    <script type="text/javascript"> 


    jwplayer("myElement-<?php echo $key.'-'.$i; ?>").setup({ 
     file: "<?php echo 'VideoFiles/'.$v; ?>", 
     width: 480, 
     height: 270 
    }); 

    <?php $i++; ?> 

下面是其中它檢查如果視頻是單個或多個的代碼，顯示的Galleria滑塊如果多個而這正是的IFRAME放置：

if(count($arrVideoFile[$key]) == 1){ 
    foreach ($arrVideoFile[$key] as $v) { ?> 

var data = [ 
    { 

    iframe: 'video.php' 

    } 
]; 


<?php 
} 
}else if(count($arrVideoFile[$key]) > 1){ 
?> 

<style> 
    #galleriavideo_<?php echo $key; ?>{ width: 500px; height: 300px; background: #000 } 
</style> 

<div id="galleriavideo_<?php echo $key; ?>"> 
<?php 
foreach ($arrVideoFile[$key] as $v) { ?> 

<script type="text/javascript"> 

var data = [ 
    { 

    iframe: 'video.php' 

    } 
]; 
</script> 
</div> 
<?php } ?> 
</div> 

     <script type="text/javascript"> 

      Galleria.loadTheme('jquery/classic/galleria.classic.min.js'); 
      Galleria.run('#galleriavideo_<?php echo $key; ?>'); 

      </script> 

<?php 

     } 
    } 
     //end:procedure video 

編輯： video.php

<?php 

$key = filter_input(INPUT_GET, "key", FILTER_SANITIZE_STRING); 
$i = filter_input(INPUT_GET, "i", FILTER_SANITIZE_NUMBER_INT); 
$v = filter_input(INPUT_GET, "v", FILTER_SANITIZE_STRING); 

?> 
<div id="myElement-<?php echo $key.'-'.$i; ?>">Loading the player... 

<script type="text/javascript"> 
jwplayer("myElement-<?php echo $key.'-'.$i; ?>").setup({ 
    file: "<?php echo 'VideoFiles/'.$v; ?>", 
    width: 480, 
    height: 270 
}); 

</script> 

</div> 

assessment.php：

if(count($arrVideoFile[$key]) > 1){ 
?> 

<style> 
    #galleriavideo_<?php echo $key; ?>{ width: 500px; height: 300px; background: #000 } 
</style> 

<div id="galleriavideo_<?php echo $key; ?>"> 
<?php 
foreach ($arrVideoFile[$key] as $v) { ?> 

<a href="video.php?key={$key}&i={$i}&v={$v}"><img class="iframe"></a> 

<?php $i++; ?> 
<?php } ?> 
</div> 

     <script type="text/javascript"> 

      Galleria.loadTheme('jquery/classic/galleria.classic.min.js'); 
      Galleria.run('#galleriavideo_<?php echo $key; ?>'); 

      </script> 

<?php 

     } 

Answer 1

下面是關於如何使用與美術館一個jwplayer簡短的例子。然後您可以嘗試將其調整爲您的代碼。

首先，有video.php文件，其中包含了jwplayer：

<div id="container"></div> 
<script type="text/javascript" src="/path/to/jwplayer.js"></script> 
<script type="text/javascript"> 
    jwplayer("container").setup({ 
     file: "http://content.bitsontherun.com/videos/3XnJSIm4-kNspJqnJ.mp4", 
     image: "http://content.bitsontherun.com/thumbs/3XnJSIm4-640.jpg" 
    }); 
</script> 

然後，有gallery.php文件，其中包含滑塊：

<div id="galleria" style="height:350px; width:550px;"> 
    <a href="/path/to/video.php"><img class="iframe"></a> 
</div> 

<script type="text/javascript" src="/path/to/jquery.js"></script> 
<script type="text/javascript" src="/path/to/galleria.js"></script> 
<script type="text/javascript"> 
    Galleria.loadTheme('/path/to/galleria.classic.min.js'); 
    Galleria.run('#galleria'); 
</script> 

如果你想顯示多個視頻在滑塊中，您可以想象一個解決方案，其中video.php需要參數並根據該參數加載視頻，即video.php?id=xx

編輯：澄清一點

你video.php文件應該採取一些參數：

$key = filter_input(INPUT_GET, "key", FILTER_SANITIZE_STRING); 
$i = filter_input(INPUT_GET, "i", FILTER_SANITIZE_NUMBER_INT); 
$v = filter_input(INPUT_GET, "v", FILTER_SANITIZE_STRING); 

<div id="myElement-<?php echo $key.'-'.$i; ?>">Loading the player... 
<script type="text/javascript" src="/path/to/jwplayer.js"></script> 
<script type="text/javascript"> 
jwplayer("myElement-<?php echo $key.'-'.$i; ?>").setup({ 
    file: "<?php echo 'VideoFiles/'.$v; ?>", 
    width: 480, 
    height: 270 
}); 

然後在gallery.php文件：

<div id="galleria" style="height:350px; width:550px;"> 
    <a href="/path/to/video.php?key=xxx&i=xxx&v=xxx"><img class="iframe"></a> 
    <a href="/path/to/video.php?key=xxx&i=xxx&v=xxx"><img class="iframe"></a> 
    <a href="/path/to/video.php?key=xxx&i=xxx&v=xxx"><img class="iframe"></a> 
    ... 
</div>