Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Конфликт скриптов (https://javascript.ru/forum/jquery/60235-konflikt-skriptov.html)

denisok82 18.12.2015 12:31

Конфликт скриптов
 
Добрый день. Прошу помощи, т.к. в JS почти ноль.
Есть три скрипта:
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" />
<script src="//code.jquery.com/jquery-1.11.3.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script type="text/javascript">
$ (function(){
    $("a.but").click(function(){
        $("h3.rad").toggleClass("disp");
    });
});
</script>
<script type="text/javascript">
/*accordion*/
  $(function() {
    $( ".accordion" ).accordion({
        header: "h3",
        heightStyle: "content",
        collapsible: true,
        //autoHeight: false,
        navigation: true,
        active: false
    });
    $( "#tabs" ).tabs();
  });
  /*вверх*/
$(window).scroll(function(){
if ($(this).scrollTop() > 100) {
$('.scrollup').fadeIn();
} else {
$('.scrollup').fadeOut();
}
});
$('.scrollup').click(function(){
$("html, body").animate({ scrollTop: 0 }, 600);
return false;
});
/*Autocmplt*/
  $(function() {
    var availableTags = [
<?php
    $sql_auto_complete = 'SELECT name FROM games';
    $arr_auto_complete = getArray($sql_auto_complete);
    foreach($arr_auto_complete as $elem)
    {
        echo "'{$elem['name']}',";
    }
?>
    ];
    $( "#search" ).autocomplete({
      source: availableTags
    });
  });
</script>

Первый - переключатель. Второй - аккордион, третий - автокомплит.
Понадобилось поставить переключатель, но он не работает. А если удалить аккордион-скрипт, то первый работает, но криво отображается сам аккордион. А вот автокомплит работает при любом раскладе.
Я подозреваю, что конфликт в названиях функций. А как их в JS изменить, не знаю.

Deff 18.12.2015 12:35

denisok82,
Попробуйте заменить цифру в библиотеке
<script src="//code.jquery.com/jquery-1.11.4.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

denisok82 18.12.2015 12:39

jquery-1.11.3.js - последняя версия. Выше не существует, сегодня проверял.

Deff 18.12.2015 12:50

denisok82,
Вот чего пишут про code.jquery.com/ui/1.11.4/jquery-ui.js
// support: jQuery <1.8
// support: jQuery 1.6.1, 1.6.2 (http://bugs.jquery.com/ticket/9413)

Так шо нун эти версии ставить для самой jQuery, - пробуйте http://code.jquery.com/jquery-1.7.2.js
Она надежна и <1.8

denisok82 18.12.2015 12:56

Deff,
прошу прощения, но вы уверены, что проблема именно в версии JQ? В течение года на сайте всё работало на этой версии и проблем не было. Работали и аккордион и хайлайтер и автокомплит.
Причем работает и новый toggle, но только если убрать скрипт аккордиона.

Deff 18.12.2015 13:07

denisok82,
Не уверен, (я посмотрел исходник UI - прочел что можно прочесть)

Deff 18.12.2015 13:12

denisok82,
В принципе, переключатель стоит ставить в самый низ всех скриптов
============
Что он и где переключает ?
============
Функции(названия) в глобале не пересекаются, ибо все переменные стоят внутри внешних функций $

denisok82 18.12.2015 13:15

Deff,
Просто скрывает часто строк.
<style>
.disp
{
    display: none;
}
</style>

Deff 18.12.2015 13:46

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" />
<script src="//code.jquery.com/jquery-1.11.3.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script type="text/javascript">
/*accordion*/
  $(function() {
    $( ".accordion" ).accordion({
        header: "h3",
        heightStyle: "content",
        collapsible: true,
        //autoHeight: false,
        navigation: true,
        active: false
    });
    $( "#tabs" ).tabs();
  });
  /*вверх*/
$(window).scroll(function(){
if ($(this).scrollTop() > 100) {
$('.scrollup').fadeIn();
} else {
$('.scrollup').fadeOut();
}
});
$('.scrollup').click(function(){
$("html, body").animate({ scrollTop: 0 }, 600);
return false;
});
/*Autocmplt*/
  $(function() {
    var availableTags = [
<?php
    $sql_auto_complete = 'SELECT name FROM games';
    $arr_auto_complete = getArray($sql_auto_complete);
    foreach($arr_auto_complete as $elem)
    {
        echo "'{$elem['name']}',";
    }
?>
    ];
    $( "#search" ).autocomplete({
      source: availableTags
    });
  });
</script>
<script type="text/javascript">
$ (function(){
    $("a.but").click(function(){
        $("h3.rad").toggleClass("disp");
    });
});
</script>

Такое расположение - не меняет проблемы ?

Дайте ссылку на тестовую страницу с проблемами

denisok82 18.12.2015 14:00

Deff,
Нет, я уже куда только не пробовал вставлять скрипт. Не помогает.
Ссылька на тест

Deff 18.12.2015 14:41

denisok82,
У меня аккордион работает
Для скройлера - у Вас кривой код!
Замените на такой:
<script type="text/javascript">
$(window).scroll(function(){
  if ($(window).scrollTop() > 100) {$('.scrollup').fadeIn();}
  else {$('.scrollup').fadeOut();}
});
$('.scrollup').click(function(e){
  e.preventDefault();
  $("html,body").animate({scrollTop:0},"slow");
});
</script>

Про кнопку для ("disp")
Я не нашёл эту кнопку - сделайте скриншот, ткните стрелкой

denisok82 18.12.2015 14:47

Deff,
Вот она: https://yadi.sk/i/whZ4ReLgmKKQZ
Есть только на тестовой странице, которую я привел выше. На других страницах её нет.

denisok82 18.12.2015 14:49

На тестовой странице я уже убрал все скрипты, кроме аккордиона и toggle. Почему-то загвоздка именно между ними двумя.

Deff 18.12.2015 14:59

denisok82,
Замените скрипт для кнопки!
<script type="text/javascript">
$(document).ready(function(){
    $("a.but").click(function(e){
    e.preventDefault();
        $("h3.rad").toggleClass('disp');
    });
});
</script>

И css для неё замените:
<style>.disp{display: none!important;}</style>

И не компонуйте скрипты в единый код до окончательной отладки!
//Просто руки кривые !

denisok82 18.12.2015 15:05

Deff,
Божечки! Всё заработало! Вот это ты Человечище! В чем же была проблема? Что было не так?

Deff 18.12.2015 15:18

denisok82,
Кому то было лень в стиле поставить cursor:pointer в стиль, и он стал сандалить везде кнопки тегом <a href="#" - которые прыгают на начало страницы
А про <style>.disp{display: none!important;}</style>
Он забыл, что в теге h3.rad проставил пустое правило display: ; - которое по умолчанию = display: block;
А стиль в теге имеет приоритет перед любым внешним стилем css, кроме с !important;

Deff 18.12.2015 15:35

denisok82,
Я бы еще поправил сss кнопки
<style>.disp,.disp+div{display: none!important;}</style>

Дабы сворачивал и раскрытые аккордионом блоки

denisok82 18.12.2015 16:41

Deff,
Огромное спасибо!


Часовой пояс GMT +3, время: 11:07.