D

유트브영상 순간검색 구현

· 2011-07-13 (수) 13:31:03 · 4039 · 9
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="history" content="">
<meta name="author" content="[email protected]">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
<title>유트브 순간검색</title>
<script type="text/javascript">
$(document).ready(function()
{

$(".search_input").keyup(function()
{
var search_input = $(this).val();
var keyword= encodeURIComponent(search_input);
var yt_url='http://gdata.youtube.com/feeds/api/videos?q='+keyword+'&format=5&max-results=1&v=2&alt=jsonc';
$.ajax
({
type: "GET",
url: yt_url,
dataType:"jsonp",
success: function(response)
{
if(response.data.items)
{
$.each(response.data.items, function(i,data)
{
var video_id=data.id;
var video_title=data.title;
var video_viewCount=data.viewCount;
var video_frame="<iframe width='640' height='385' src='http://www.youtube.com/embed/"+video_id+"' frameborder='0' type='text/html'></iframe>";
var final="<div id='title'>"+video_title+"</div><div>"+video_frame+"</div><div id='count'>"+video_viewCount+" Views</div>";
$("#result").html(final); // Result
});
}
else
{
$("#result").html("<div id='no'>No Video</div>");
}
}
});
});
});
function yts(search_input){
var keyword= encodeURIComponent(search_input);
var yt_url='http://gdata.youtube.com/feeds/api/videos?q='+keyword+'&format=5&max-results=1&v=2&alt=jsonc';
$.ajax
({
type: "GET",
url: yt_url,
dataType:"jsonp",
success: function(response)
{
if(response.data.items)
{
$.each(response.data.items, function(i,data)
{
var video_id=data.id;
var video_title=data.title;
var video_viewCount=data.viewCount;
var video_frame="<iframe width='640' height='385' src='http://www.youtube.com/embed/"+video_id+"' frameborder='0' type='text/html'></iframe>";
var final="<div id='title'>"+video_title+"</div><div>"+video_frame+"</div><div id='count'>오늘까지뷰 "+video_viewCount+" Views</div>";
$("#result").html(final); // Result
});
}
else
{
$("#result").html("<div id='no'>No Video</div>");
}
}
});
}
yts('Empire State of Mind');
</script>
</head>
<body>
<div id="wrap">
<h2>DOKJIN PLAY GROUND</h2>
<div id="result"></div>
<h2>검색어를 입력하세요 <input type="text" class='search_input' /> </h2>
<br />
<h2><a href="#" onclick="yts('아이유');">onclick="yts('아이유');"</a></h2>
<ul>
</div>
</body>
</html><div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 16:57:14 JavaScript에서 이동 됨]</div>

첨부파일

youtube.html (2.7 KB) 90회 2011-07-13 13:31
|

댓글 9개

2011-07-13 (수) 21:29:11
좋은자료 갑사합니다~
아.. 멋지십니다..
2011-07-21 (목) 09:00:25
와우 좋은자료 감사
감사합니다.
2011-08-04 (목) 20:00:08
보고 잘 갑니다.
활동지수가 턱없이 모자라는군요
좋네요 ^^
댓글을 작성하시려면 로그인이 필요합니다.

개발자팁

5,403건

개발과 관련된 유용한 정보를 공유하세요. 질문은 QA에서 해주시기 바랍니다.

+
분류 제목 글쓴이 날짜 조회
JavaScript 11-08-11 조회 3,459
기타 11-08-08 조회 3,440
기타 11-08-08 조회 3,964
기타 11-08-08 조회 1,823
기타 11-08-08 조회 1,608
JavaScript 11-08-07 조회 2,102
Flash 11-08-06 조회 3,268
기타 11-08-06 조회 2,138
정규표현식
[정규표현식]
11-08-06 조회 3,794
jQuery 11-08-05 조회 3,225
기타 11-08-05 조회 2,037
PHP 11-08-04 조회 5,056
기타 11-08-04 조회 3,382
기타 11-08-04 조회 3,723
JavaScript 11-08-03 조회 2,465
jQuery 11-08-03 조회 5,396
기타 11-08-03 조회 2,146
MySQL 11-08-02 조회 3,297
MySQL 11-07-27 조회 1,985
MySQL 11-07-25 조회 2,115
JavaScript 11-07-22 조회 2,059
기타 11-07-21 조회 2,923
기타 11-07-19 조회 1,558
기타 11-07-13 조회 4,040
JavaScript 11-07-12 조회 3,694
Flash 11-07-11 조회 4,708
기타 11-07-11 조회 1,685
기타 11-07-09 조회 2,142
jQuery 11-07-03 조회 2,217
PHP 11-07-01 조회 3,280