・動画をキーワードから検索して表示させるappの途中過程です。検索窓#search
に入力されたワードから候補動画を10個表示させたいです。
html
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8"> 5 <title>You-Tube-Juke-Box</title> 6 <style> 7 body { 8 text-align: center; 9 } 10 #player { 11 height: 640px; 12 width: 396px; 13 } 14 </style> 15</head> 16<body> 17 <h1 style="font-family:optima;font-style:italic;">You-Tube-Juke-Box</h1> 18 <hr> 19 <div id="player"></div> 20 <hr> 21 <input type="text" id="q"> 22 <input type="button" id="search" value="Seach!"> 23 <hr> 24 <input type="button" id="prev" value=" << Preview "> 25 <input type="button" id="play" value=" Play ▶︎ "> 26 <input type="button" id="pause" value=" Pause ⬛︎ "> 27 <input type="button" id="Next" value=" Next >> "> 28 <hr> 29 <ul id="list"> 30 </ul> 31 <script src="https://code.jquery.com/jquery-1.7.2.min.js"></script> 32 <script src="myscript.js"></script> 33</body> 34</html>
・[Search!]を押下することによって、ConsoleにObject
が返ってきてほしいのですが、
jquery-1.7.2.min.js:4 ▶︎GET https://gdata.youtube.com/feeds/api/videos?q=%25E6%2584%259B&alt=json&max-results=10&v=2 410 ()
(「愛」 をSearch)
jquery-1.7.2.min.js:4 ▶︎GET https://gdata.youtube.com/feeds/api/videos?q=love&alt=json&max-results=10&v=2 410 ()
(「love」 をSearch)
と返ります。
javascript
1$(function(){ 2 $('#search').click(function() { 3 var url = "https://gdata.youtube.com/feeds/api/videos"; 4 var options = { 5 q: encodeURIComponent($('#q').val()), 6 alt: "json", 7 "max-results": 10, 8 v: 2 9 }; 10 11 //(2) $.ajax({ 12 // url: url, 13 // data: options, 14 // dataType: 'jsonp', 15 // success: function(rs) { 16 // console.log(rs); 17 // }, 18 // }); 19 $.get(url, options, function(rs){ //(1) 20 console.log(rs); 21 }, "json"); 22 }); 23});
・上記「"max-results"」のダブルクォーテーションを外すと、ページ更新時にこの行が
myscript.js:8 Uncaught SyntaxError: Unexpected token
となるのでつけました。 また、コメントアウト(2)も試しましたが変わりありませんでした。
・教材はhttp://dotinstall.com/lessons/youtube_jukebox_js/7605で、スペルチェックしながらgoogle apiのページを見ましたが、解消には至っておりません。 お力添えいただけますと幸いです。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。