Почему на отдельных страницах не отрабатывает jquery?

Question

[Александр Гамов]

Собственно есть несколько страниц под одним шаблоном. На некоторых скрипт отрабатывает как следует, на других нет.
Вот мой код

$(document).ready(function() {

    $('aside').before(function() {
        return '<a href="#" data-toggle="#content" id="sidebar-toggle" class="btn_1"><div class="btn_menu"></div></a>';
    });
    $("[data-toggle]").click(function() {
        var toggle_el = $(this).data("toggle");
        $(toggle_el).toggleClass("open-sidebar");
    });

    var sticky = new Waypoint.Sticky({
        element: $('.btn_1')[0]
    })

});

В первую очередь интересует почему не создается новый элемент перед блоком aside.
К примеру вот на этой странице все хорошо (Блок aside прячется за границы экрана и на его месте появляется вертикальная полоса-кнопка для его вызова, видна только при ширине менее 1000px)
slowdream.ru/clients/service
а вот здесь уже нет
slowdream.ru/catalog/new

Причем если в консоле или редакторе в ручную прописать, то все работает как надо.
upd. Данная проблема наблюдается в FF.

Comments

[Алексей Зуев]

В firefox проблема?

[Александр Гамов]

Алексей Зуев: О! точно, в хроме все ок.

Answer 1

[Алексей Зуев]

Ваш скрипт прерывается на ошибке

ReferenceError: setSlider is not defined

в коде следующего вида

if ($.fn.slider) {
    setSlider();
    function setSlider() {
      var val1 = parseInt($("#minCost").val()*1),
      val2 = parseInt($("#maxCost").val()*1);
      if (val1 > 400000) val1 = 400000;
      if (val2 > 400000) val2 = 400000;
      if ($("#minCost").val().length) $("#minCost").val(val1);
      if ($("#maxCost").val().length) $("#maxCost").val(val2);
      $("#slider-price").slider("values", 0, val1);
      $("#slider-price").slider("values", 1, val2);
    }
  };

Если вы в начале своего скрипт пропишите "use strict", то увидите проблему

SyntaxError: in strict mode code, functions may be declared only at top level or immediately within another function

Стандарт нам запрещает объявлять функции внутри блока инструкции, можно только на самом верхнем уровне или непосредственно внутри другой функции.
Исходя из этого предлагаю следующий вариант решения проблемы - обернуть тело блока инструкции в IIFE

if ($.fn.slider) {
    (function(){
      setSlider();
      function setSlider() {}
    })();
  };

На странице, где нет проблемы, интерпретатор просто не заходит внутрь блока if, поэтому там всё правильно и код дойдет до ваших манипуляций с aside.
Советую использовать строгий режим, чтобы не нарываться на такие непонятные проблемы. В нестрогом режиме бывают много нюансов, запомнить которые порой трудно и в разных браузерах обработка ошибок может быть совсем разной.

Comments

[Александр Гамов]

идеальный ответ, спасибо !