JQuery гармошка не работает

0

Я пытаюсь использовать плагин jquery ui accordion, и я не знаю, почему он не работает.

Я пришел к http://jqueryui.com/ и прочитал документацию, я выбрал тему, а затем я выбрал "UI Core toggle all", а затем в виджетах я выбрал только "Аккордеон".

Я сохраняю файлы в своей папке "acc", а затем импортирую файлы следующим образом:

<link rel="stylesheet" type="text/css" href="/jquery-ui-style.css" />
<title>Projet</title>
<script type="text/javascript" src="/jquery.js"></script>
<script type="text/javascript" src="/jquery-ui.js"></script>
<script type="text/javascript" src="/acc.js"></script>

И затем в моем файле acc.js. Я начинаю аккордеон:

$(function (){
    $('.accordion').accordion();
});

Но он не работает, у меня есть только мой обычный html без аккордеона.

Мой html:

 <div class="accordion">

        <h3>Title 1</h3>    
        <div>
            <p>My first post.</p>
        </div>        

        <h3>Title 2</h3>
        <div>
            <p>My second post.</p>  
        </div>        

        <h3>Title 3</h3>
        <div>
            <p>My third post</p>    
        </div>

    </div><!-- /accordion -->
  • 0
    Где вы размещаете этот HTML-файл?
  • 0
    проверьте исходную HTML-страницу и отметьте, правильно ли импортированы ваши сценарии
Показать ещё 1 комментарий
Теги:
jquery-ui-accordion
accordion

3 ответа

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

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

Если папка acc находится в корневой папке вашего сайта, вы должны рассмотреть возможность изменения ваших сценариев и css для:

<link rel="stylesheet" type="text/css" href="/jquery-ui-style.css" />
<script type="text/javascript" src="/jquery.js"></script>
<script type="text/javascript" src="/jquery-ui.js"></script>
<script type="text/javascript" src="/acc.js"></script>

Удалите точки - так как это означает, что вы пытаетесь добраться до папки, где вы находитесь (в URL-адресе, а не в файле с html).

Если это не сработает, нажмите f12 и проверьте свою консоль. Возможно, у вас есть другие ошибки js, препятствующие работе аккордеона

Поделиться
  • 1
    Спасибо, проблема была действительно в этом! Но это странно, потому что у меня есть папка проекта, а затем у меня есть папка tpl и папка acc, мой пример с html accordeon находится внутри папки tpl, а сценарии jquery находятся в папке acc, которая находится вне папки tpl! Так что я думаю, что мне нужно было сделать ../ чтобы пришла 1 папка обратно! Но это работает, как вы сказали, спасибо :)
1

Похоже, что вы отключили JqueryUI Core, загрузите стандартную версию JqueryUI и перезапишите созданную версию.

Скрипка показывает, что код правильный. Если вам не хватает ядра, виджеты не будут работать

$(function (){
    $('.accordion').accordion();
});
Поделиться
1

Я не совсем знаком с аккордеонами jQuery UI, но вы попытались поместить ваш $ ('. Accordion'). Accordion(); внутри jQuery document.ready?

См. Код ниже, скорее всего, ваш аккордеон будет инициализирован до того, как появится фактический html на странице. Предположим, что вы правильно настроили свой html, и вы включаете в себя правильные файлы JavaScript jQuery и т.д.

$(document).ready(function() { 
 $('.accordion').accordion();
});

Надеюсь, это поможет.

Поделиться
  • 2
    $(function () - это еще один способ сказать, что готов, поверьте, это помогает в конфликтах библиотек
  • 1
    Ах да, не осознавал этого :)

Ещё вопросы

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