HTML не загружается динамически в Div

0

Я смог использовать ответы, представленные на странице загрузки HTML динамически, в div с jQuery для полной загрузки html в div в прошлом, однако, с новым проектом, который я начал, который основан на шаблоне codrops (multi- level push menu), страницы не загружаются в указанный .content div

Веб-страница находится здесь. Я загрузил все соответствующие jquery-библиотеки, а тестовая страница "bio.html" правильно исправлена.

Я работаю очень конкретно по первой ссылке меню " ul li " "Биография", чтобы просто проверить ее функциональность.

Код, который я использую в jquery, является

$(document).ready(function(){
    $("#bio").click(function(){
        $('.content').load('bio.html');
        //alert("Thanks for visiting!");
    }); 
});

Селектор "#bio" был применен к

<li><a class="icon icon-male" id="bio">Biography</a></li>

в index.html. В теге div класса = "content" у меня есть css,

.content {
    color: white;
    background: rgba(0,0,0,0.9);
    background: -moz-linear-gradient(top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0.9)), color-stop(100%, rgba(0,0,0,0.6)));
    background: -webkit-linear-gradient(top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 100%);
    background: -o-linear-gradient(top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 100%);
    background: -ms-linear-gradient(top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
    width: 60%;
    border-radius: 2px;
    padding: 3em 2em;
    max-width: 1200px;
    max-height: 800px;
    margin: 0 auto;
    box-shadow: 0 5px 7px -5px rgba(0,0,0,.7);
}

Я не знаю, вмешивается ли какой-либо из вышеперечисленного кода в то, что не позволяет динамически загружать страницу при нажатии на обработчик. Я внес изменения в class= "content" из класса = "content clearfix", потому что я не слишком беспокоюсь об использовании хакера clearfix в данный момент, что было единственным изменением в идентификации элемента в исходных файлах html.

  • 0
    я получаю $ is not defined в моей консоли, любой также получить то же самое.
  • 0
    Да, js/linking.js должен быть включен после jQuery.
Показать ещё 2 комментария
Теги:
clearfix

2 ответа

1
Лучший ответ

вы вызвали библиотеку jQuery после своего скрипта, сначала вызовите jQuery, а затем ваш скрипт

Изображение 174551

и я рекомендую вам использовать версию 1.9.0 или более поздней.

  • 0
    Исправлено полностью, также ссылка на 1.9.0 спасибо
0

Посмотрев на свою ссылку, вы загружаете файл jquery после того, как код для него "$" не определен, переместите вашу библиотеку jquery выше этого, и она должна начать работать.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню