jquery - ajax-さまざまなコンテンツを表示

Question

同じページで（ブラウザで新しいページを開かずに）音楽を聴いたり、ビデオを見たりしたい。だから私はこの目的のためにajaxを使いたいです。私はさまざまなファイルを持っていて、そのタイプに応じてそれらを使って何かをしたいと思っています。たとえば、私は1.mp3-聞く、2.avi-見る、3.png-見る。hrefをクリックした場合と同じ動作をする必要があります。<a href="http://server.com/3.png" target="blank"></a>-新しいページを開いてロードします3.png。私を助けてください！ありがとう。

Answer 1

コンテンツの個別のクラスを次のように作成します。

<a href="http://server.com/1.png" target="blank" class='png'></a>
<a href="http://server.com/2.avi" target="blank" class='avi'></a>
<a href="http://server.com/3.mp3" target="blank" class='mp3'></a>

Now code in individual classes as

$('.png').click(function(){
 alert('png');
});
$('.avi').click(function(){
 alert('png');
});
$('.mp3').click(function(){
 alert('mp3');
});

また

$('a').click(function(){
   var ext=$(this).attr('href').val().substring($(this).attr('href').val().lastIndexOf('.')+1).toLowerCase();
   if(ext=='png'){
     //code for png
   } //and so on
})

Answer 2

これはどう：

<div id="contentdiv" style="display:none">
<iframe id="contentframe"></iframe>
</div>

<script>
$(document).ready(function(){
 $('a').click(function(){
   var hreflink = $(this).attr('href');
   $('#contentframe').attr('src',hreflink);
   $('#contentdiv').show();
   return false;
 });
});
</script>