2010-04-27 4 views
1

Я только что загрузил вкладки пользовательского интерфейса jQuery. В прилагаемом файле index.html он отлично работает, CSS и все, без настройки. Я скопировал файлы на свой веб-сервер, сохранив структуру каталогов, и скопировал код содержимого в уже существующий index.html, но он не работает.jQuery UI Tabs не работает

Мой Заголовок Код

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> 
<link type="text/css" href="css/start/jquery-ui-1.8.custom.css" rel="stylesheet" /> 
<script type="text/javascript" src="js/jquery-ui-1.8.custom.min.js"></script> 
<script type="text/javascript"> 
$(function(){ 
// Tabs 
$('#tabs').tabs();    
}); 
</script> 

Мой код тела

<div id="tabs"> 
     <ul> 
      <li><a href="#tabs-1">First</a></li> 
      <li><a href="#tabs-2">Second</a></li> 
      <li><a href="#tabs-3">Third</a></li> 
     </ul> 
     <div id="tabs-1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> 
     <div id="tabs-2">Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.</div> 
     <div id="tabs-3">Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.</div> 
    </div> 

Мой выход

* First 
* Second 
* Third 

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tem incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud занятие ullamco labis nisi ut aliquip ex ea com. Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum. Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, следовательно vestibulum, lacus. Портфолио Мауриса ullamcorper augue.

Все файлы указаны правильно, и все они скопированы и вставлены непосредственно из полностью функционального файла., но это не сработает.

+1

У вас есть ссылка на страницу? Что-то здесь не загружается, не может многое сказать, не имея возможности увидеть страницу. –

+0

его на http://cl58logs.co.cc/ – Christopher

ответ

2

Удалите ссылку JQuery на линии 90. (я получил помощь по #jQuery на IRC сети Freenode)

1

Обновления на основе вашего сайта - JQuery 1.3 включаются позже на странице завинчивания дворняжки здесь :) Искать и удалить это, так что это не загружается дважды/баловаться с JQuery UI:

<script src="javascripts/jquery.js" type="text/javascript"></script> 

Предыдущий ответ - в случае, если это полезно для других, чтобы отлаживать позже

Попробуйте заменить свой раздел сценария с этим:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" /> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script> 

<script type="text/javascript"> 
    $(function(){ 
    $('#tabs').tabs();    
    }); 
</script> 

Вместо того, чтобы смотреть на свой сервер для скрипта/css, он смотрит на CDN от Google. Если это сработает, тогда ваши файлы сценариев не будут правильно указаны, либо разрешения на файлы, либо, скорее, неправильный относительный путь .. или что-то еще. В любом случае они недоступны в js/ относительно страницы в этом случае.

Если файлы указаны в mysite.com/js, используйте /js/ вместо js/, поэтому ссылки относятся к корню сайта.

+0

Я пробовал это. Это все еще не работает. Тот же выход. – Christopher

+0

@christopher - Вы снова включаете jQuery на странице: '', это вызывает всевозможные проблемы :) –

+0

У вас есть попробовал запустить его с Firefox/Firebug с включенной вкладкой «Сеть», чтобы узнать, какие файлы загружаются на самом деле? –

0

Используйте панель инструментов веб-разработчика (например, Firebug или панель инструментов разработчика IE или что-то еще, что есть в Chrome), чтобы просмотреть ответ HTTP на ваши файлы javascript и css. Скорее всего, относительный URL-адрес, указанный выше, неверен. Если это так, вы увидите 404 ответа, и в этом случае вы должны проверить, что http://yoursite.com/js/jquery-1.4.2.min.js действительно возвращает желаемый контент. Если это ответ 401, у вас могут не быть прав доступа к файлам.

HTH.

Обновление: я могу получить доступ к файлам javascript и css. Каков URL страницы, которую вы тестируете?