2013-04-26 3 views
2

У меня есть меню, которое просматривает список слайдов на определенной странице. Все шло хорошо, с помощью следующего кода (HTML):Почему переменная в этом случае не определена?

<ul class="dropdown"> 
     <li class="orange"><a href="#" data-jumpslide="2"><div class="list-item one-liner"><div class="left"><span id="functionality-icon"></span></div> <div class="right">When to do it</div><div class="clear"></div></div></a></li> 
     <li class="orange"><a href="#" data-jumpslide="3" ><div class="list-item one-liner"><div class="left"><span id="functionality-icon"></span></div> <div class="right">Key faces</div><div class="clear"></div></div></a></li> 
     <li class="orange"><a href="#" data-jumpslide="5" ><div class="list-item one-liner"><div class="left"><span id="functionality-icon"></span></div> <div class="right">Functionalities</div><div class="clear"></div></div></a></li> 
</ul> 

и JQuery является:

$('a[data-jumpslide]').each(function(idx, ele){ 
    $(ele).on('click', function(){ 
     var slideToJump = $(this).data('jumpslide'); 
     window.slider.go(false, slideToJump+1); 
    }); 
}); 

Как вы можете видеть, когда нажата ссылка, она просто перемещается ползун на конкретную стр.

Но теперь мне нужно было создать универсальное меню, которое могло бы перемещать ползунок на любую страницу. Поэтому, если я являюсь страницей «Страница 1», и я нажимаю ссылку на 7-й слайд на странице «Страница 2», код должен открыть страницу 2 и перейти на слайд 7.

Вот как я изменил HTML :

<ul class="dropdown"> 
     <li class="orange"><a href="page2.php" data-jumpslide="2" data-goto="page2"><div class="list-item one-liner"><div class="left"><span id="functionality-icon"></span></div> <div class="right">When to do it</div><div class="clear"></div></div></a></li> 
     <li class="orange"><a href="page2.php" data-jumpslide="2" data-goto="page2" ><div class="list-item one-liner"><div class="left"><span id="functionality-icon"></span></div> <div class="right">Key faces</div><div class="clear"></div></div></a></li> 
     <li class="orange"><a href="page2.php" data-jumpslide="2" data-goto="page2" ><div class="list-item one-liner"><div class="left"><span id="functionality-icon"></span></div> <div class="right">Functionalities</div><div class="clear"></div></div></a></li> 
</ul> 

и это, как я изменил JQuery:

$('a[data-jumpslide]').each(function(idx, ele){ 
    $(ele).on('click', function(e){ 
     e.preventDefault(); 
     var href = $(this).attr('href'); 
     var slideToJump = $(this).data('jumpslide'); 
     var gotoPage = $(this).data('data-goto'); 

     slideToJump++; 
     if (gotoPage != '') { 
       window.slider.go(false, slideToJump); 
     } 
     else { 
      var url = href+'#'+slideToJump; 
      window.location = url; 
     } 
    }); 
}); 

var hash = window.location.hash; 
$(document).ready(function(idx, ele){ 
    if (hash != '') {   
     window.setTimeout(function() { 
      window.slider.go(false, hash); 
     }, 2000); 
    } 
    else { 
     console.log("No hash found " + hash); 
    } 
}); 

Так что здесь происходит, что, когда пользователь нажимает на любую ссылку, которая принимает его на другую страницу (скажем, страница 2), его перенаправляет и после того, как он достигает там, он проверяет, имеют ли страницы хэш или нет. Если это произойдет, он перемещает слайд к этому номеру.

Теперь все хорошо, кроме того, что слайд не перемещается к номеру! Несмотря на то, что код тот же, хотя window.slider получает ползунок в нем, он все равно не перемещается.

Когда я создал console.log в функции смены слайдов, он дает мне «undefined». (Код ниже)

slideChangedCallBack: function(idx, slide) { 

     if (console) console.log('slideChangedCallBack: '+slide.data('pagename')); 
     if (s && s.t){ 
      s.pageName = slide.data('pagename'); 
      s.t(); 
     } 

     ... 
    } 
+1

'window.location.hash' возвращает строку, например '# 2' в вашем случае. Обратите внимание на символ '#' в строке по сравнению с его получением из атрибута data, где символ '#' не существует. –

+0

Я теперь официально ударяю лицо 2 раза. Спасибо, что вложил в меня какой-то смысл Кевин. – Steve

ответ

0

Итак, для тех, кто ищет для точного изменения, я сделал это: -

var hash = window.location.hash.substring(1); 

вместо этого: -

var hash = window.location.hash; 
+0

Вы согласны с этим ответом, нажав на значок галочки влево? Благодаря! – halfer