js中使用jq对div内容更改后，swipper无法左滑动。
基本代码：<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="swiper.min.css" />
</head>
<body>
<div class="swiper-container" id="swiper1">
<div class="swiper-wrapper">
<div class="swiper-slide">slider1</div>
<div class="swiper-slide">slider2</div>
<div class="swiper-slide">slider3</div>
<div class="swiper-slide">slider4</div>
<div class="swiper-slide">slider5</div>
<div class="swiper-slide">slider6</div>
<div class="swiper-slide">slider7</div>
<div class="swiper-slide">slider8</div>
<div class="swiper-slide">slider9</div>
<div class="swiper-slide">slider10</div>
</div>
</div>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="swiper.min.js"></script>
<script>
var mySwiper = new Swiper('.swiper-container', {
slidesPerView: 3,
initialSlide: 9,
});
var html = '<div class="swiper-wrapper">';
html += '<div class="swiper-slide">slider11</div>';
html += '<div class="swiper-slide">slider12</div>';
html += '<div class="swiper-slide">slider13</div>';
html += '<div class="swiper-slide">slider14</div>';
html += '<div class="swiper-slide">slider15</div>';
html += '<div class="swiper-slide">slider16</div>';
html += '<div class="swiper-slide">slider17</div>';
html += '<div class="swiper-slide">slider18</div>';
html += '<div class="swiper-slide">slider19</div>';
html += '<div class="swiper-slide">slider20</div>';
html += '</div>';
$("#swiper1").html(html);
var mySwiper2 = new Swiper('.swiper-container', {
slidesPerView: 3,
initialSlide: 9,
});
</script>
</body>
</html>
在使用jq对swiper1的内容更改后，再加载swiper-container后，无法往左滑动。
有没有大神帮忙看看，小弟不胜感激啊。:(
页:
[1]