Конфликт Ajax и jQuery

Главные вкладки

Аватар пользователя GodZiLA GodZiLA 21 марта 2012 в 13:04

Всем доброго времени суток!
Проблема такая - есть несколько скриптов, которые используют библиотеки jQuery (такие как jQuery.min.js, slider.jQuery.min.js ну и сам jQuery). Когда убираю jQuery.noConflict(); в head, скрипты, само собой, отключаются, зато работает Ajax (модуль Views, фильтр, с помощью exposed form). Когда же ставлю в каждый скрипт jQuery.noConflict(); скрипты работают, зато перестаёт работать Ajax (Views инфу фильтрует, но вместо загрузки страницы через Ajax прописывает код запроса в адресную строку).
Пробовал и var j = jQuery.noConflict(); и вместо $(this) j(this), и просто jQuery вместо $, вообщем всё, что нашёл, но проблема не решается.

<?php
<head>
<?
php print $head?>
  <title><?php print $head_title?></title>
  <?php print $styles?>
    <script type="text/javascript" src="<?php print $base_path $directory?>/jquery.min.js"></script>
    <script type="text/javascript" src="<?php print $base_path $directory?>/menu.js"></script>
    <script type="text/javascript" src="<?php print $base_path $directory?>/anmenu.js"></script>
    <script type="text/javascript" src="<?php print $base_path $directory?>/jquery.tipTip.js"></script>
    <script src="<?php print $base_path $directory?>/slides.min.jquery.js"></script>
    <link type="text/css" rel="stylesheet" media="all" href="<?php print $base_path $directory?>/tipTip.css" />
    
    
    
    <?php print $scripts?>
<!--[if IE]>
<link href="style_ie.css" rel="stylesheet" type="text/css">
<![endif]-->
<script language="JavaScript">
jQuery.noConflict();
        $(function(){
            for (i=1;i<=5;i++) {
                    a='slide'+i;
                    document.getElementById(a).style.width = (screen.width-84)+'px';
                    };            
            $('#slides').slides({
                generateNextPrev: true,
                play: 7500
            });        
        });
</script>
<script language="JavaScript">
jQuery.noConflict();
$(function(){
    $('#left_menu a')
        .css( {backgroundPosition: "-205px 0"} )
        .mouseover(function(){
            $(this).stop().animate({backgroundPosition:"(0px 0)"}, {duration:300})
        })
        .mouseout(function(){
            $(this).stop().animate({backgroundPosition:"(-205px 0)"}, {duration:200, complete:function(){
                $(this).css({backgroundPosition: "-205px 0"})
            }})
        })
});
</script>    
<script type="text/javascript">
$(function(){
$(".js_bottom").tipTip({maxWidth: "auto", edgeOffset: 10, defaultPosition: "bottom", delay: 600});
  });
</script>
</head>
?>

Код head приложил выше. Кто что знает, напишите пожалуйста.

Комментарии

Аватар пользователя kolosnitsyn kolosnitsyn 21 марта 2012 в 13:31

У друпала имеется своя библиотека jQuery, как раз при помощи которой и работает и Ajax в т.ч.

Надо поставить модуль jQuery Update и выкинуть из head jQuery

Скрипты надо добавлять через .info файл темы

Аватар пользователя kpv_dnepr@drupal.org kpv_dnepr@drupal.org 10 апреля 2013 в 18:59

У меня такая же проблема, на сайте верстальщик сделал Slider, для работы нужны

jquery-1.6.min.js - есть в Drupal
jquery.tools.min.js - подключаю через файл тема.info

$(document).ready(function () {
        $(".scrollable").scrollable({ circular: true, mousewheel: false, wheelSpeed: 600 }).navigator().autoscroll(10000);
        $('.right .block_activity p:last-child').css({ 'padding-bottom':'25px', 'background': 'none'});
        $('.right .block:last-child').css({ 'padding-bottom':'25px'});
        $('.txt .line:last-child').css({ 'padding-bottom':'25px'});
        $('.navi').css({'margin-top' : '-' + $('.navi').height()/2 + 'px' });
       
        $('.calendar .table_calendar tr:odd td').css({'background':'#be1522', 'color':'#fff'});
       
        $(".fancy a").fancybox();
});

Скрипт отрабатывает все корректно, но при это не работают все Ajax элементы Drupal (блоки, views и т.д.)

Что подскажете? Может кто сталкивался?

Аватар пользователя simon_db simon_db 10 апреля 2013 в 19:22

1. Выкинуть jquery update
2 .В head, после css, перед скриптами вставляешь.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
    var $jq = jQuery.noConflict();
</script>

3. Далее все подключаешь используя $jq вместо $

Аватар пользователя kpv_dnepr@drupal.org kpv_dnepr@drupal.org 10 апреля 2013 в 19:30

В <head> добавил <script type="text/javascript">var $jq = jQuery.noConflict();</script>

сам скрипт изменил, теперь он выглядит вот так

$jq(document).ready(function () {
        $jq(".scrollable").scrollable({ circular: true, mousewheel: false, wheelSpeed: 600 }).navigator().autoscroll(10000);
        $jq('.right .block_activity p:last-child').css({ 'padding-bottom':'25px', 'background': 'none'});
        $jq('.right .block:last-child').css({ 'padding-bottom':'25px'});
        $jq('.txt .line:last-child').css({ 'padding-bottom':'25px'});
        $jq('.navi').css({'margin-top' : '-' + $jq('.navi').height()/2 + 'px' });
       
        $jq('.calendar .table_calendar tr:odd td').css({'background':'#be1522', 'color':'#fff'});
       
        $jq(".fancy a").fancybox();
});

Теперь скрипт не работает, и ajax то же(((

Аватар пользователя kpv_dnepr@drupal.org kpv_dnepr@drupal.org 10 апреля 2013 в 19:40

Победа, спасибо.

Код выглядит так

$(document).ready(function () {
        $jq(".scrollable").scrollable({ circular: true, mousewheel: false, wheelSpeed: 600 }).navigator().autoscroll(10000);
        $jq('.right .block_activity p:last-child').css({ 'padding-bottom':'25px', 'background': 'none'});
        $jq('.right .block:last-child').css({ 'padding-bottom':'25px'});
        $jq('.txt .line:last-child').css({ 'padding-bottom':'25px'});
        $jq('.navi').css({'margin-top' : '-' + $('.navi').height()/2 + 'px' });
       
        $jq('.calendar .table_calendar tr:odd td').css({'background':'#be1522', 'color':'#fff'});
       
        $jq(".fancy a").fancybox();
});