Question

我想启用触控设备的滑键来更改我的画廊上的图片：

画廊标记是这样的：

<div class="gallery">
    <a href="http://localhost:8104/files/pic-spa-01.jpg" data-rel="gallery-1" style="background-image: url('http://localhost:8104/files/pic-spa-01-750x750.jpg')"></a>
    <a href="http://localhost:8104/files/pic-spa-02.jpg" data-rel="gallery-1" style="background-image: url('http://localhost:8104/files/pic-spa-02-750x750.jpg')"></a>
</div>

我正在尝试这样：

if ( Modrnizer.touch ) {
            $.getScript(base_url + "/js/idangerous.swiper-2.1.min.js?p1", function () {

                //Main Swiper
                swiper = new Swiper('.gallery', {
                    onSlideChangeStart: function(){

                    }
                });

            })
}

但是我收到了这个错误：

未捕获的TypeError：无法读取未定义的属性'childNodes'

因为我尝试了多个.gallery个实例：

$.getScript(base_url + "js/idangerous.swiper-2.1.min.js?p1", function () {
    //Main Swiper
    swiper = new Swiper('.gallery:eq(0)', {
        onSlideChangeStart: function(){

        }
    });
})

然后错误变为：

Uncaught TypeError: Cannot read property 'childNodes' of undefined VM1007:47

所以谁知道我做错了什么？

在这个小提琴中我甚至得到了一个不同的错误..

http://jsfiddle.net/9VBha/118/

Answer 1

您需要保留所需的Swiper HTML结构：

<div class="swiper-container gallery">
  <div class="swiper-wrapper">
    <div class="swiper-slide"><a href="http://localhost:8104/files/pic-spa-01.jpg" data-rel="gallery-1" style="background-image: url('http://localhost:8104/files/pic-spa-01-750x750.jpg')"></a></div>
    ...
  </div>
</div>

如果您无法访问HTML，则可以在Swiper init之前通过脚本进行转换，例如：

$('.gallery').addClass('swiper-container');
$('.gallery').wrapInner('<div class="swiper-wrapper"></div>');
$('.gallery a').wrap('<div class="swiper-slide"></div>');

jQuery idangerous swipper插件：选择器中的错误？

1 个答案: