Question

首先，我有一個非常基本的圖像輪播，顯示我通過PHP foreach循環抓取的視頻縮略圖。當用戶點擊縮略圖時，它將相應的視頻加載到上面的div中。旋轉木馬工作得很好，但是將onclick事件發送給div並不會。

好吧我有以下代碼行我想要執行和代碼編輯器說它的正確，但是當我在瀏覽器中運行它我得到一個sytax錯誤「意外的令牌」，並且代碼不會結束工作。

echo "<li><a href='javascript:void(0);' onClick='setVideo(" .$youtube_link. "," .$type. "," .$video_title. "," .$custom_description. "," .$postURL. ");'>"; 
    print_thumbnail($featured_thumb,"thumbnail",$youtube_link); 
    echo "</a></li>"; 

所以我用下面的代碼來代替：

echo '<li><a href="javascript:void(0);" onClick="setVideo(\'' . $youtube_link . '\', \'yt\',\'' . $video_title . '\',\'' . $custom_description . '\',\'' . $postURL . '\');">'; 
    print_thumbnail($featured_thumb,"thumbnail",$youtube_link); 
    echo "</a></li>"; 
    } ?> 

此代碼的工作，並把視頻到格但在某些特定的視頻縮略圖時點擊它返回一個「意外的標識符」錯誤和沒有按」工作。我查看了爲每個縮略圖發送的數據，並且我沒有看到每個縮略圖之間的任何差異，以使其適用於某些縮略圖，而不是其他縮略圖。錯誤也是一致的，並且每次都保持在相同的帖子中。所以我的問題是，是來自JQuery的錯誤還是它發送給JQuery的數據？

這是相應的JQuery函數。

function setVideo(videoID, playerType, postTitle, postExcerpt, postURL){ 
    width = 720; 
    height = 405; 
    if(playerType == 'yt') { 
    $('#video_player').replaceWith("<iframe id='video_player' class='youtube-player' type='text/html' width='"+ width +"' height='"+ height +"' src='http://www.youtube.com/embed/" + videoID + "?hd=1&html5=1&rel=0&autohide=1&showinfo=0' frameborder='0' ></iframe>"); 
    } 
    } 

Answer 1

想通了大部分。使用這段代碼，我注意到進入$ custom_description的數據包含一個單引號（'），通過關閉jquery並因此給出錯誤。

echo '<li><a href="javascript:void(0);" onClick="setVideo(\'' . $youtube_link . '\', \'yt\',\'' . $video_title . '\',\'' . $custom_description . '\',\'' . $postURL . '\');">'; 
    print_thumbnail($featured_thumb,"thumbnail",$youtube_link); 
    echo "</a></li>"; 
    } ?> 

我做了一個簡單的str_replace函數，像這樣：

$string_desc = str_replace("'","\\'", $custom_description); 
$string_title = str_replace("'","\\'", $video_title); 

echo '<li><a href="javascript:void(0);" onClick="setVideo(\'' . $youtube_link . '\', \'yt\', 
\'' . $string_title . '\',\'' . $string_desc . '\',\'' . $postURL . '\');">'; 
print_thumbnail($featured_thumb,"thumbnail",$youtube_link); $video_title; 
echo "</a></li>"; 

，一切工作

Answer 2

我與jqVideoBox測試，我已經從YouTube，Metacafe的視頻進行測試，谷歌和iFilm等...

<a title="Youtube example." class="vidbox" href="http://www.youtube.com/v/NRH2jEyiiLo&hl=en&fs=1&rel=0"><img alt="Youtube" style="width: 130px;" src="http://i2.ytimg.com/vi/NRH2jEyiiLo/default.jpg"/></a> 
<a title="Metacafe example." class="vidbox" href="http://www.metacafe.com/watch/386357/teach_magic_be_magician_money_magic/"><img alt="Metacafe" style="width: 130px;" src="http://images.metacafe.com/thumb/386357/2767198/4/catalog_top_item5/0/teach_magic_be_magician_money_magic.jpg"/></a> 
<a title="Google Video example." class="vidbox" href="http://video.google.com/videoplay?docid=1811233136844420765"><img alt="Google Video" style="width: 130px;" src="http://video.google.com/ThumbnailServer2?app=vss&amp;contentid=d53e613f82f74c96&amp;offsetms=50000&amp;itag=w160&amp;lang=en&amp;sigh=QGtXRNh3rW4hfa6DSQSFtfOimno"/></a> 
<a title="iFilm example." class="vidbox" href="http://www.ifilm.com/video/2783985"><img alt="iFilm" style="width: 130px;" src="http://img4.ifilmpro.com/resize/image/stills/films/resize/istd/2783985.jpg?width=130"/></a> 

，只是調用這個函數和西元開放！

$(document).ready(
function() 
{ 
    $(".vidbox").jqvideobox(); 
} 

）;

，我已經進口的3個JS

<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript" src="js/swfobject.js"></script> 
<script type="text/javascript" src="js/jqvideobox.js"></script> 

你可以試試這個庫，看看會發生什麼......