Как вывести страницу в div без перезагрузки?

Question

[vikholodov]

пятая секция под названием WOW-кейсы, вывел туда ссылки на посты, хочу выводить пост в блоке #wow-container без перехода по ссылке , написал скрипт, но после появления надписи LOADING..., меня перебрасывает по ссылке. Что не так делаю?

$('#menu-wow-cases li a').click(function(){
var toLoad = $(this).attr('href')+'#wow-container';
$('#wow-container').hide('fast',loadContent);
$('#menu-wow-cases').append('<li id="load">LOADING...</li>');
$('#load').fadeIn('normal');
function loadContent() {
$('#wow-container').load(toLoad,'',showNewContent)
}
function showNewContent() {
$('#wow-container').show('normal',hideLoader);
}
function hideLoader() {
$('#load').fadeOut('normal');
}
});

Answer 1

[Camaro67]

Нужно еще отменить стандартное действие.

Для этого, вот эту часть
$('#menu-wow-cases li a').click(function(){

замените на

$('#menu-wow-cases li a').click(function(event){
    event.preventDefault();

Comments

[vikholodov]

Супер! Гигантское спасибо. А как сделать чтобы первая ссылка уже была загружена по умолчанию?

[Camaro67]

vikholodov, как вариант можно так

$('#menu-wow-cases li:first a').trigger( 'click' );

[Camaro67]

vikholodov, и у вас jQuery подключена несколько раз, такого быть не должно.

[vikholodov]

Не работает так =(
а с Jquery не пойму, вроде 1 раз подключена, сейчас выключил, все равно в консоле scripts.js?ver=1.0.0:1 Uncaught TypeError: $ is not a function

Answer 2

[zoozag]

1. У вас подключена jQuery два раза и конфликтует, поэтому у вас в логах scripts.js?ver=1.0.0:1 Uncaught TypeError: $ is not a function
2. Когда отлавливаете клики по ссылкам, не забывайте отменять дейсвие по умолчанию:

$( "a" ).click(function( event ) {
  event.preventDefault();
  ...
});