не может получить JQuery .load для загрузки содержимого в DIV

Question

У меня есть список, как, например:

<ul id="yearMenu"> 
    <li>Select a year</li> 
    <li><a href="AJAX/2010PR.html">2010</a> |</li> 
    <li><a href="AJAX/2009PR.html">2009</a> |</li> 
    <li><a href="AJAX/2008PR.html">2008</a> |</li> 
    <li><a href="AJAX/2007PR.html">2007</a> |</li> 
    <li><a href="AJAX/2006PR.html">2006</a> |</li> 
    <li><a href="AJAX/2005PR.html">2005</a></li> 
</ul> 

ниже, чем в другом контейнере это Див:

<div id="tableContent" class="tabWrapp"></div> 

и следующую функцию загрузки :

$("#ul#yearMenu li a").click(function() { 
    var $parent = $(this).parent(); 
    $parent.addClass("selected").siblings().removeClass("selected"); 
    var href = $(this).attr('href'); 
    $("#tableContent").load(href + " #tableContent ", function() { 
    //need to do something here? 
    }); 
}); 

, но все ссылки открываются с другой страницы. что мне нужно сделать, чтобы загрузить это в div #tableContent?

Answer 1

Попробуйте это:

$("ul#yearMenu li a").click(function(event) { 
    var $parent = $(this).parent(); 
    $parent.addClass("selected").siblings().removeClass("selected"); 
    var href = $(this).attr('href'); 
    $.get(href, function(data) { 
    $('#tableContent').html(data); 
    }); 
    event.preventDefault(); 
}); 

Answer 2

Попробуйте добавить

return false; 

до конца вашего "нажмите кнопку" обработчика. Без этого будет выполняться действие по умолчанию для каждого тега <a>.

Было бы еще лучше (безопаснее, некоторые сказали бы), чтобы вызвать .preventDefault() на объекте события:

$('#whatever').click(function(evt) { 
    // ... 
    evt.preventDefault(); 
}); 

Это будет позволять событие пузырь, но предотвратить действие по умолчанию <a>.

Answer 3

Не используйте href для хранения ссылки. используйте пользовательский attr, как «data-link =» http://link.com »'

<li><a data-link="AJAX/2010PR.html">2010</a> |</li> 

поэтому, когда вы нажмете ничего, ничего не произойдет.

В вашем яваскрипта кода, вы получите ссылку с помощью:

$(selector).attr("data-link"); 

Тогда грима А также ссылок, использовать некоторые CSS.

Это просто альтернативный способ, но с «preventDefault()» или «return false» также хорошо работает.