jQuery.noConflict() не могу вкурить как с ним работать

HTML: 
<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Членські внески</a></li>
        <li><a href="#tabs-2">Передплата за журнал</a></li>
        <li><a href="#tabs-3">Інформаційно-консультаційні послуги</a></li>
        <li><a href="#tabs-4">Фонд допомоги нотаріусам</a></li>
    </ul>
    <div id="tabs-1">
      <span class="innerspan150 tabbed-top tabbed-right">Ідентифікаційний номер</span><span class="tabbed-top tabbed-right"><input class="input-200 margin55r" value="" name="" /></span><span class="tabbed-top tabbed-right">ПІБ</span><span class="tabbed-top"><input class="input-300" value="" name="" /></span>
      <span class="innerspan150 tabbed-top tabbed-right">Членські внески за</span><span class="tabbed-top tabbed-right"><input class="input-150" value="" name="" /> місяць Без ПДВ.</span><span class="tabbed-top tabbed-right">Сума, грн </span><span class="tabbed-top tabbed-right"><input class="input-100" value="" name="" /></span>
      <div class="tabbed-top textright"><button class="upper">Перейти до оплати</button></div>
    </div>
    <div id="tabs-2">
      <div><span class="spantabs tabbed-right active gurnal" val="div1">Приватним нотаріусам</span><span val="div2" class="spantabs tabbed-right gurnal">Державним нотаріальним конторам та архівам</span><span val="div3" class="spantabs tabbed-right gurnal">Фізичним особам</span></div>
      <div class="gurnals" id="div1">
        <span class="innerspan200 tabbed-top tabbed-right">Номер свідотства на право зайняття нотаріальною діяльністю</span><span class="innerspan200 tabbed-top tabbed-right"><input class="input-200 tabbed-right" value="" name="" /></span><span class="tabbed-top tabbed-right">ПІБ</span><span class="tabbed-top tabbed-right"><input class="input-250" value="" name="" /></span><br />
        <span class="innerspan175 tabbed-top tabbed-right"><strong>Адресу доставки журналу</strong></span><br />
        <span class="tabbed-top tabbed-right">Місто</span><span class="innerspan150 tabbed-top tabbed-right"><input class="input-150 tabbed-right" value="" name="" /></span><span class="tabbed-top tabbed-right">Адреса</span><span class="innerspan200 tabbed-top tabbed-right"><input class="input-200 tabbed-right" value="" name="" /></span><span class="innerspan115 tabbed-top tabbed-right">Номер контактного телефону</span><span class="innerspan115 tabbed-top tabbed-right"><input class="input-100 tabbed-right" value="" name="" /></span>
        <div class="tabbed-top textright"><button class="upper">Перейти до оплати</button></div>
      </div>
      <div class="gurnals hidden" id="div2">
        <span class="innerspan tabbed-top tabbed-right">Код нотаріальної контори</span><span class="tabbed-top tabbed-right"><input class="input-250" value="" name="" /></span><br />
        <span class="innerspan175 tabbed-top tabbed-right"><strong>Адресу доставки журналу</strong></span><br />
        <span class="tabbed-top tabbed-right">Місто</span><span class="innerspan150 tabbed-top tabbed-right"><input class="input-150 tabbed-right" value="" name="" /></span><span class="tabbed-top tabbed-right">Адреса</span><span class="innerspan200 tabbed-top tabbed-right"><input class="input-200 tabbed-right" value="" name="" /></span><span class="innerspan115 tabbed-top tabbed-right">Номер контактного телефону</span><span class="innerspan115 tabbed-top tabbed-right"><input class="input-100 tabbed-right" value="" name="" /></span>
        <div class="tabbed-top textright"><button class="upper">Перейти до оплати</button></div>
      </div>
      <div class="gurnals hidden" id="div3">
        <span class="innerspan tabbed-top tabbed-right">ПІБ</span><span class="tabbed-top tabbed-right"><input class="input-250" value="" name="" /></span><br />
        <span class="innerspan175 tabbed-top tabbed-right"><strong>Адресу доставки журналу</strong></span><br />
        <span class="tabbed-top tabbed-right">Місто</span><span class="innerspan150 tabbed-top tabbed-right"><input class="input-150 tabbed-right" value="" name="" /></span><span class="tabbed-top tabbed-right">Адреса</span><span class="innerspan200 tabbed-top tabbed-right"><input class="input-200 tabbed-right" value="" name="" /></span><span class="innerspan115 tabbed-top tabbed-right">Номер контактного телефону</span><span class="innerspan115 tabbed-top tabbed-right"><input class="input-100 tabbed-right" value="" name="" /></span>
        <div class="tabbed-top textright"><button class="upper">Перейти до оплати</button></div>
      </div>
    </div>
    <div id="tabs-3">
      <span class="innerspan tabbed-top tabbed-right">Ідентифікаційний номер</span><span class="tabbed-top tabbed-right"><input class="input-200" value="" name="" /></span><span class="innerspan200 tabbed-top tabbed-right">Номер свідотства на право зайняття нотаріальною діяльністю</span><span class="innerspan115 tabbed-top tabbed-right"><input class="input-140 tabbed-right" value="" name="" /></span><br />
      <span class="innerspan tabbed-top tabbed-right">ПІБ</span><span class="tabbed-top tabbed-right"><input class="input-300" value="" name="" /></span><span class="innerspan175 tabbed-top tabbed-right">Номер контактного телефону</span><span class="innerspan150 tabbed-top tabbed-right"><input class="input-150 tabbed-right" value="" name="" /></span><br />
      <table class="inline"><tr><td><span class="innerspan tabbed-top tabbed-right">Дата проведення заходу</span></td><td><div class="tabbed-right">число</div><div class="textcenter"><input class="input-50 tabbed-right" value="" name="" /></div></td><td><div class="tabbed-right">місяць</div><div class="textcenter"><input class="input-50 tabbed-right" value="" name="" /></div></td><td><div class="textcenter tabbed-right">рік</div><div><input class="input-50" value="" name="" /></div></td></tr></table><span class="innerspan175 tabbed-top tabbed-right">Сумма з ПДВ, 20%, грн</span><span class="innerspan tabbed-top tabbed-right"><input class="input-50 tabbed-right" value="" name="" /></span><br />
      <div class="tabbed-top textright"><button class="upper">Перейти до оплати</button></div>
    </div>
    <div id="tabs-4">
      Безповоротна добровільна <strong>благодійна пожертва.</strong> Без ПДВ.<br />
      <span class="innerspan tabbed-top tabbed-right">Сума, грн</span><input class="input-300" value="" name="" /><br />
      <div class="tabbed-top floatleft"><small><strong>Перерахування грошової благодійної пожертви</strong> благодійній організації <strong>не є об'єктом оподаткування ПДВ</strong> згідно п. 185 ПКУ.</small></div><br />
      <div class="tabbed-top textright"><button class="upper">Перейти до оплати</button></div>
    </div>
</div>

<script type="text/javascript">
jQuery(function($){
  $('#tabs').tabs();
  $('button').button();
  $('.gurnal').click(function(event){
    $('.spantabs').removeClass('active');
    $(this).addClass('active');
    $('.gurnals').hide();
    $('#'+$(this).attr('val')).show();
  });
});

ну и css
Код: 
.innerspan   {display: inline-block; text-align: right;}
.innerspan150{display: inline-block; width: 149px; text-align: right;}
.innerspan200{display: inline-table; width: 210px; text-align: right;}
.innerspan115{display: inline-table; width: 115px; text-align: right;}
.innerspan175{display: inline-table; width: 175px; text-align: right;}
.tabbed-top  {margin-top: 20px;}
.tabbed-right{margin-right: 15px;}
.margin55r   {margin-right: 55px;}
.textright   {text-align: right;}
.textcenter  {text-align: center;}
.floatleft   {float: left;}
.input-50    {width: 50px;}
.input-100   {width: 100px;}
.input-140   {width: 140px;}
.input-150   {width: 150px;}
.input-200   {width: 200px;}
.input-250   {width: 250px;}
.input-300   {width: 300px;}
.upper       {text-transform: uppercase;}
.spantabs    {margin-top: 10px; border-bottom: 1px dashed #2e6e9e; cursor:pointer; color: #2e6e9e;}
.active,.spantabs:hover{color: #e17009;}
.hidden      {display:none;}
.inline      {display:inline;}

тестировал на стандартном шаблоне

ну а в основном всегда была проблема mootools + jq. Но всё это решаемо
я делаю добавление вот этого:
HTML: 
<script type="text/javascript" src="/components/com_mtree/js/jquery-1.6.4.min.js"></script>
<script type="text/javascript">
jQuery.noConflict();
</script>
в head
ну и потом в самом body
HTML: 
jQuery(function(){
            jQuery('#dt_newsscrollwrap2055 .dt_newsscroll_list').NewsScroll2055();
         });

это на joomla 1.5, так не конфликтует, по крайней мере у меня
 
Вот из примера Для просмотра ссылки Войди или Зарегистрируйся можно посмотреть, как юзать свои алиасы:
Код: 
jq162 = jQuery.noConflict( true );
$log.append( "<h3>After $.noConflict(true)</h3>" );
$log.append( "1st loaded jQuery version ($:( " + $.fn.jquery + "<br>" );
$log.append( "2nd loaded jQuery version (jq162:( " + jq162.fn.jquery + "<br>" );
 
Последнее редактирование модератором:
я уже переименовал все методы tabs и все равно не работает (
Код: 
<script>
    // Both jQuery UI and jQuery Tools define a tabs function on jQuery objects.
    // We use both libraries (jQuery Tools for its non-restricting tabs function and overlay; jQuery UI for autocomplete.)
    // To avoid a conflict over tabs, rename the jQuery UI tabs.  Call this code after loading jQuery UI but before
    //  calling jQuery Tools.
    var oldTabs = jQuery.fn.tabs;
    delete jQuery.fn.tabs;
    jQuery.fn.jQueryUiTabs = oldTabs;   
   
    jQuery(document).ready(function(){
        jQuery("#dateFromFrom").datepicker();
        jQuery("#dateFromTo").datepicker();
        jQuery("#dateToFrom").datepicker();
        jQuery("#dateToTo").datepicker();
       
        jQuery("#_jQueryUiTabs_").jQueryUiTabs();
    });
</script>
 
Ну не может оно не работать просто. Открывайте консоль в браузере, смотрите ошибки.
 
я переименовал все слова "tabs" на "_t" в библиотеке jQuery и все равно ничего не изменилось.
заметил, что перед тем как исчезнуть на странице в тате вырисовывается шапка и главное меню по ходу оно зацикливается.
Для просмотра ссылки Войди или Зарегистрируйся[/URL]Для просмотра ссылки Войди или Зарегистрируйся
на второй картинке консоль нерабочей странички а на третей консоль рабочей.
 
какие либо ошибки в консоле файрбага есть? так вслепую довольно сложно определить
Типичные проблемы Joomlа по теме java script это то что по умолчанию движок подключает как и jquery так и mootols, поэтому зачастую они конфликтуют

Как вариант использовать какой либо другой плагин табов, в сети их достаточное количество
 
fmedia написал(а):
какие либо ошибки в консоле файрбага есть?
Нажмите для раскрытия...
Для просмотра ссылки Войди или Зарегистрируйся
отключил все файлы mootols и страничка перестала улетать. но шапка и меню все равно появляется в табе после пары секунд после перезагрузки страницы. значит в проблеме виноват не только mootols.
может мне jquery обновить? у меня v2.1.0 уже есть v2.1.1
 
Код: 
<script>
jQuery.noConflict();

(function($) {
    //use '$' as you normally would
    $(document).ready(function() {
        //code here that depends on the document being fully loaded
    });

})(jQuery); 

</script>
 
omear написал(а):
Код: 
<script>
jQuery.noConflict();

(function($) {
    //use '$' as you normally would
    $(document).ready(function() {
        //code here that depends on the document being fully loaded
    });

})(jQuery);

</script>
Нажмите для раскрытия...
абсолютно ничего не изменилось

кстати забыл написать Joomla 2.5.14

kolio написал(а):
HTML: 
jQuery(function(){
            jQuery('#dt_newsscrollwrap2055 .dt_newsscroll_list').NewsScroll2055();
         });
Нажмите для раскрытия...
что делает этот код? у меня с ним jQuery вообще не работает


перепробовал кучу версий jQuery ситуация точно такая же

поставил чистую joomla для тестов и вот, что получается на стандартном шаблоне jQuery tab работает без jQuery.noConflict() и с $

значит виновник всего шаблон. буду ковырять дальше его
 
Последнее редактирование модератором:
Войдите или зарегистрируйтесь для ответа.
Назад
Сверху