JavaScriptを使用してリンクをクリックしたときにYouTubeで動画を検索しますか？

Question

リンクをクリックしたときに、ページを再読み込みせずにYouTube動画を読み込むページを作成しようとしています。私はボタンが押されたときのために働いて、コードを持っていた、それはのように見えた：私は、リンクのために働くために、私はオンライン続くチュートリアルから、このコードを変更しようとしている

$(document).ready(function() { 
    $(".button").click(function() { 
     var search = $(".input").val(); 
     var keyword= encodeURIComponent(search); 
     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_frame="<iframe width='420' height='236' src='http://www.youtube.com/embed/"+video_id+"' frameborder='0' type='text/html'></iframe>"; 
        $("#video").html(video_frame); 
       }); 
      } else { 
       $("#video").html("<div id='no'>No Video</div>"); 
      } 
     } 
    }); 
}); 
}); 

。私は次に何をすべきか分かりませんが、クラスを変更しようとしましたが、リンクから検索データを取得する際に問題が発生しました。私はこれを改善したいことは次のとおりです。

<div id="main_section"> 
    <div id=ytVid> 
     <iframe width="480" height="360" src="http://www.youtube.com/embed/xJ3-NnNx6Zs" frameborder="0" allowfullscreen></iframe> 
    </div> 
    <p id="1">Jackie Wilson - Reet Petite</p> 
    <p id="2">Queen - Bohemian Rhapsody</p> 
</div> 

誰かが「ジャッキー・ウィルソン - Reet小柄」をクリックすると、テキストやリンクを女王の歌がするように、それは、ユーチューブの動画を更新します。

おかげ

編集：へ

$(document).ready(function() { 
    $("#songInfo").click(function() { 
    function openLink(evt) { 
      var search = evt.target.innerHTML; 
      var keyword= encodeURIComponent(search); 
      ... rest of code ... 

とHTML：： 私はJavaScriptを有効にしてにファイルを変更し、私はテキスト何をクリックしたときに

<p id="1" onclick="openLink(evt);"> Jackie Wilson - Reet Petite</p> 
<p id="2" onclick="openLink(evt);"> Queen - Bohemian Rhapsody</p> 

、申し訳ありません が起こりましたHTMLでJavaScriptにかなり新しい、私は早く言っておくべきだった。

Answer 1

<p>タグの "onclick"イベントで同じことをしていると思います。documentationは、それらのタグに対して有効です。このような何か：

document.getElementById("1").onclick = "openLink(evt);"; 

あなたが<p>タグのテキストが必要な場合はその後、このような何かしてみてください：

function openLink(evt) { 
    var search = evt.target.innerHTML; 
    var keyword= encodeURIComponent(search); 
    ... // just like your unnamed function 
}