jQuery .load() Funktion gibt nichts zurück

Question

Ich habe den folgenden Codeblock in Index.aspx . Wenn ich auf die Schaltfläche klicke, wird die Seite neu geladen und zeigt nichts an (leere Seite).

<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

Ihre Seite wird neu geladen, weil dies das Standardverhalten des Browsers ist, wenn der Benutzer auf eine a (Link) HTML-Element.

Sie können dieses Standardverhalten beenden, indem Sie einen Parameter im Klick-Handle verwenden und die preventDefault-Methode :

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

Answer 2

Rückgabe false von der click Handler-Funktion, um dem Browser mitzuteilen, dass er dem Link nicht folgen soll. Dies ermöglicht es Ihnen auch, einen echten Link in href für Browser, die JavaScript nicht unterstützen, oder für den Fall, dass der Benutzer es deaktiviert hat.

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