从 jquery 添加图片到 slick

Question

我正在尝试从 jQuery 向我的光滑滑块添加图像。根据 slick，默认结构应该如下所示。

<div class="your-class">
  <div><img src=""> </></div>
  <div><img src=""> </></div>
  <div><img src=""> </></div>
</div>

问题是我需要从 jQuery 设置我的图像，但是当我这样做时，图像不会通过 slick 进行结构化，而只是留在 "your-class" div.

这就是我现在正在努力实现的方式。这个问题是 slick 应该创建子元素并将此内容附加到并构造它。

let image = ['<div><img class="selectedImage" src="',
             e.target.result,
             '" title="',
             escape(theFile.name), '"/></div>'].join('');

$(".your-class").append(image);

这是这样的结果：

<div class="your-class slick-initialized slick-slider">
  <div class="slick-list draggable"></div>
  <div><img src="link_to_image"> </></div
</div>

这是想要的结果：

<div class="your-class slick-initialized slick-slider">
  <div class="slick-list draggable">
    <div class="slick-track">
      <div class="slick-slide">
        <div>
          <div><img src="link_to_image"> </></div
        </div>
      </div>
    </div>
  </div>
</div>

Answer 1

let image = ['<div><img class="selectedImage" src="', e.target.result,
  '" title="', escape(theFile.name), '"/></div>'
].join('');


$(".your-class").append(image);

$('.your-class').slick('unslick')

//initialize again here .your-class

从 jquery 添加图片到 slick

Adding images to slick from jquery

javascript

jquery

slick.js