別のDIVでDIVをクリックして開いている子リンク全体をどのようにすることができますか？

Question

が、私はここにこの質問への前駆体を尋ねた：私は、以下に示す最初のスクリプトを削除した後、次に Click link in DIV and show PHP/HTML in separate DIV

、私は2番目のスクリプトが動作するように取得することができました。私は質問を改訂しましたが、それは黙っているようです。だから私は少し修正された質問があります。

以下の2つのスクリプトの間の矛盾はどのようにして、どのようにそれらを組み合わせて動作させることができますか？ HTML

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $(".side_items").click(function(){ 
    window.location=$(this).find("a").attr("href"); 
    return false; 
    }) 
}); 
</script> 

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $(".side_items a").click(function(e){ 
    e.preventDefault(); 
     $("#main_content").load($(this).attr("href")); 
    }); 
}); 

</script> 

：基本的に私は

JavascriptをDIV（ ".side_items "）内の任意の場所をクリックし、別のDIV（" #main_content"）で開かれた子アンカーリンクを持つことができるようにしたいです： （わずかに単純化された）

<div id="main_content"> 
</div> 

<div id="right_side"> 
    <div class="side_items"> 
    <a href="content.html"> 
    <img src="images/examplethumb.png" /><br /> 
    Content</a> 
    </div> 
</div> 

両方のスクリプトが個々の所望の結果を達成するために独立して動作します。

$(document).ready(function(){ 
    $(".side_items").click(function(){ 
     $("#main_content").load($(this).find("a").attr("href")); 
     return false; 
    }) 
}); 

を、それを破壊：これはそれを行うだろう

Answer 1

$(".side_items").click(fn); 

side_itemsのクラスを持つすべての要素を検索し、それらにクリックイベントハンドラ（fn）を割り当てます。これらの要素の1つがクリックされるたびに、fnが要素のコンテキストで実行されます。破棄されたコードでは、セレクタ.side_items aを使用していました。これは、クリックハンドラがdiv内のリンクにのみバインドされており、div自体にはバインドされていないことを意味していました。

$(this).find("a").attr("href") 

現在の要素（this）内に含まれているすべてのリンクを検索し、見つかった最初の要素からhref属性の値を取得します。破棄されたコードでは、コンテキスト（this）がリンクです。ハンドラはdivを含んでいるので、コンテキストはdivになります。リンクを取得するには、それを見つける必要があります。

$("#main_content").load(href); 

main_contentのidを持つ要素を検索し、それにhrefで見つけたコンテンツをロードします。破棄されたコードでは、location.hrefを設定していたため、ページが離れてしまいました。

Answer 2

$（）。ready（..）ハンドラを2回割り当てようとしていると思います。