0

我对 JQuery 滑块“Swiper”有疑问(此处的 API - http://www.idangero.us/sliders/swiper/api.php)。加载页面时,我需要将 Swiper 滚动到某个“幻灯片”。=> 我使用函数“mySwiper.swipeTo”来滚动 Swiper。这在函数“onSlideClick”中工作正常,但是当我将类似的代码添加到函数“onFirstInit”或“onInit”或“onSwiperCreated”时,没有任何工作(只有错误)。看起来 Swiper 不知道什么是“mySwiper”=> 使用“mySwiper.slides.length”之类的代码会出错并且 Swiper 不起作用。

Incicialization Swiper的代码示例:

  <script type="text/javascript">
  window.onload = function() {
    var mySwiper = new Swiper('.swiper-container',{
      mode:'vertical',
      slidesPerView: 5,
      grabCursor: true,
      loop: false,
          onFirstInit: function() {
            zmena_obsahu_load();
          },
          onSlideClick: function() {
            zmena_obsahu_klik();
          }
    });

    var zmena_obsahu_load = function() {
      var index_lo = $(".menu_aktivni_trida").attr("data-id");

      var pocet_slidu = mySwiper.slides.length;
      if( (index_lo-2) <= 0 ){
        mySwiper.swipeTo((index_lo), '500', false);
      }
      else{
        mySwiper.swipeTo((index_lo-2), '500', false);        
      }

    };

    var zmena_obsahu_klik = function() {
      var index_slidu = $(mySwiper.clickedSlide).attr("data-id");
      var index_slidu2 = mySwiper.clickedSlideIndex;

      $(".obsah_posuv").hide();
      $("#posuv_"+index_slidu).show();
      $(".swiper-slide").removeClass("menu_aktivni_trida");
      $(mySwiper.clickedSlide).addClass("menu_aktivni_trida");

      var pocet_slidu = mySwiper.slides.length;
      if( (index_slidu2-2) <= 0 ){
        mySwiper.swipeTo((index_slidu2), '500', false);
      }
      else{
        mySwiper.swipeTo((index_slidu2-2), '500', false);        
      }

    };

    $('.posuv_menu_h').on('click', function(e){
      e.preventDefault()
      mySwiper.swipePrev()
    })
    $('.posuv_menu_d').on('click', function(e){
      e.preventDefault()
      mySwiper.swipeNext()
    })

  }
  </script>

这段代码写给我:“TypeError:zmena_obsahu_load 不是函数”但“zmena_obsahu_klik”没问题。

我的函数“zmena_obsahu_klik”工作正常=>忽略这个函数没有问题,为此而不是为我使用的东西写。

对不起我的英语不好。

4

1 回答 1

0

我有这个问题的解决方案。=>“刷卡哈希导航”(idangero.us/sliders/swiper/plugins/hashnav.php#slide3)

不是理想的解决方案,但可以工作,我重写了这个脚本的代码,使其在 url 上没有丑陋的哈希 =>

更改var hash = document.location.hash.replace('#', '');var hash = document.getElementById("akt_rok").textContent;

并且 id 为 "akt_roke" 的 span 有 "display: none" => 它可以在 url 中没有哈希的情况下工作。

于 2014-07-14T09:49:23.377 回答