何も返さないjQueryの.load（）関数

Question

Index.aspxに次のコードブロックがあります。ボタンをクリックすると、ページがリロードされ、何も表示されません（空のページ）。

<div class="filter_block"> 
       <span>Show</span> 
       <a href="#"><span class="title">full shedulle</span></a> 
       <a id="buttonFindFilmByName" class="active"><span class="title">films name</span></a> 
       <script type="text/javascript"> 
        $(document).ready(function() { 
         $("#buttonFindFilmByName").click(function() { 
          $('#listInfoBlock').load('cinema/filmlist'); 
         }); 
        }) 
       </script> 
      </div><!-- .filter_block--> 

      <div id="listInfoBlock" class="list_infoBlock">   

      </div><!-- .list_infoBlock--> 

Answer 1

それは、ユーザがa（リンク）HTML要素をクリックする標準ブラウザの動作ですので、あなたのページがリロードされます。

あなたがクリックハンドルでパラメータを使用してpreventDefault method呼び出すことで、このデフォルトの動作を停止することができます：clickハンドラ関数からfalseを

$("#buttonFindFilmByName").click(function(e) { 
    e.preventDefault(); 
    .... 

Answer 2

戻るリンクをたどるしていないブラウザを伝えるために。これにより、JavaScriptをサポートしていないブラウザ、またはユーザがオフにした場合に、hrefに実際のリンクを設定することもできます。

$(document).ready(function() { 
    $("#buttonFindFilmByName").click(function() { 
    $('#listInfoBlock').load('cinema/filmlist'); 
    return false; // <====== FIX 
    }); 
});