0

首先是一些上下文，我有一个非常基本的图像轮播，它显示我通过 php foreach 循环抓取的视频缩略图。当用户点击缩略图时，它会将相应的视频加载到上面的 div 中。轮播效果很好，但是将其发送到 div 的 onclick 事件却没有。

好的，我想要执行以下代码行，代码编辑器说它是正确的，但是当我在浏览器中运行它时，我收到一个语法错误“Unexpected Token”，并且代码最终无法正常工作。 

  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>";
  } ?>

此代码有效并将视频放入 div 但在某些视频缩略图上单击时会返回“意外标识符”错误并且不起作用。我查看了为每个缩略图发送的数据，我没有看到每个缩略图之间的任何差异，使其适用于某些但不适用于其他缩略图。错误也是一致的，并且每次都停留在相同的帖子上。所以我的问题是，错误是来自 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>");
   }
  }
4

2 回答 2

0

想通了大部分。使用这段代码，我注意到进入 $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>";

一切正常

于 2012-12-19T16:53:13.137 回答
0

我已经用 jqVideoBox 进行了测试，并且我已经测试了来自 youtube、metacafe、google 和 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>

你可以试试这个库，看看会发生什么......

于 2012-12-18T16:23:14.313 回答