jquery ajax呼び出し：複数のリンクが1つのdivにデータを読み込む

Question

私は動的に生成されたリンクのリストを持っています。各リンクは、ロードする別のページを要求します。クリックされたリンクに応じて、divをajax.load呼び出しで埋める必要があります。問題は、すべてのリンクをリセットして同じdivを埋めたいことです。私は、リンクごとに別々のdivを作らずにこれをやっているのが苦労しています。これは私が探しているものではありません。

これはこれまで私が持っていたものですが、1つのリンクでのみ動作します。

<a data-toggle="modal" href="#myModal">Link</a> 

<div class="modal hide fade" id="myModal"></div> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#myModal').load('mypage.php'); 
    }); 
</script> 

Answer 1

このような場合はどうですか。 my_links.htmlという名前の別個のhtmlファイルを作成します。 このように、多くのリンクを作成します。

<a href = "first_link.php">First link</a> 
<a href = "second_link.php">Second link</a> 
<a href = "third_link.php">Third link</a> 
<a href = "forth_link.php">Forth link</a> 

今jQueryを使ってこれを行う

<script type="text/javascript"> 
$(document).ready(function() { 
    $('#myModal').load('my_links.html'); 
}); 

Answer 2

あなたが試してみることができます

してください次：あなたは質問私は理解している場合

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#myModal').empty(); // clears the div 
     $('#myModal').load('mypage.php'); // load again 
    }); 
</script> 

Answer 3

私はわからないけど、私はこのようなsomethigsが欲しいと思います：

HTML

<a class="link" data-toggle="modal" href="link1.php" >Link 1</a> 
<a class="link" data-toggle="modal" href="link2.php" >Link 2</a> 
<a class="link" data-toggle="modal" href="link3.php" >Link 3</a> 

<div class="modal hide fade" id="myModal"></div> 

jQueryの

$("a.link").click(function(){ 
     $("#myModal").html($(this).attr("href")); /*$("#myModal").load($(this).attr("href"));*/ 
     return false; 
    });​ 

http://jsfiddle.net/3RCAg/