我有一个输入字段,其中预期值为 youtube 链接。我需要这样做,以便一旦将 youtube 链接放入输入中,它会自动显示我创建的 div(显示视频的缩略图、标题和描述),而无需重新加载页面。
这是输入的 HTML 代码以及需要放置 div 的位置:
<div class="formRow">
<div class="grid2"><label>Link</label></div>
<div class="grid10" style="position:relative">
<input name="link" type="text" placeholder="Link to the video..." />
</div>
<div class="clear"></div>
</div>
<!-- THE FOLLOWING PHP CODE CONTAINS THE DIV THAT NEEDS TO BE SHOWN -->
<?php
$url = $_POST['link'];
parse_str( parse_url( $url, PHP_URL_QUERY ), $youtube_id );
define('YT_API_URL', 'http://gdata.youtube.com/feeds/api/videos?q=');
$video_id = $youtube_id['v'];
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, YT_API_URL . $video_id);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
$feed = curl_exec($ch);
curl_close($ch);
$xml = simplexml_load_string($feed);
$entry = $xml->entry[0];
if(!$entry) { exit('Error: No such video exists.'); }
$media = $entry->children('media', true);
$group = $media->group;
$title = $group->title;
$desc = $group->description;
$thumb = $group->thumbnail[0];
list($thumb_url) = $thumb->attributes();
$content_attributes = $group->content->attributes();
$vid_duration = $content_attributes['duration'];
$duration_formatted = str_pad(floor($vid_duration/60), 1, '0', STR_PAD_LEFT) . ':' . str_pad($vid_duration%60, 1, '0', STR_PAD_LEFT);
$image = WideImage::load('' . $thumb_url . '');
$resizedImage = $image->resize(320, 180, 'outside')->crop('center', 'middle', 320, 180);
$resizedImage->saveToFile("../../assets/video_images/" . $video_id . ".jpg");
echo '<div class="preview-container">
<div class="preview-image">
<img src="../../assets/video_images/' . $video_id . '.jpg" width="185" height="104" />
<div class="preview-timestamp">' . $duration_formatted . '</div>
</div>
<div class="preview-title"><a href="https://www.youtube.com/watch?v=' . $video_id . '">' . $title . '</a></div>
<div class="preview-desc">' . $desc . '</div>
<div class="clear"></div>
</div>';
?>
再说一次,我需要做的是,一旦将 youtube 链接放入输入字段,它应该自动显示在 PHP 代码中回显的 div,而无需刷新页面(使用 AJAX 等)。
请帮忙。