通过按钮实现一个页面多个swiper的显示隐藏出现的问题

一个页面多个swiper通过按钮显示隐藏出现的问题

描述：一个页面有多个swiper，一开始都隐藏，通过点击按钮显示对应的swiper。
html部分代码：

"btn">
	  
"btnBox">
		  
"button button1">
		  
"button button2">
		  
"button button3">
		  
"button button4">
	  
  
  
  
"qie qie1">
		
"swiper-container">
		    
"swiper-wrapper">
		      
"swiper-slide" style="background-image:url(img/30.png)">
		      
"swiper-slide" style="background-image:url(img/31.png)">
		      
"swiper-slide" style="background-image:url(img/32.png)">
		      
"swiper-slide" style="background-image:url(img/33.png)">
		      
"swiper-slide" style="background-image:url(img/34.png)">
		      
"swiper-slide" style="background-image:url(img/35.png)">
		    
		
  
  
"qie qie2">
		
"swiper-container">
		    
"swiper-wrapper">
		      
"swiper-slide" style="background-image:url(img/36.png)">
		      
"swiper-slide" style="background-image:url(img/37.png)">
		      
"swiper-slide" style="background-image:url(img/38.png)">
		    
		
  

js部分代码：

$(function(){
	var swiper1 = new Swiper('.qie1 .swiper-container', {
		 autoplay: 5000,
		 speed: 500,
		 loop: true,
		 observer:true, 
		 observeParents:true,
		 autoplayDisableOnInteraction : false,  //用手滑动后能继续自动轮播，默认true不轮播
	 });
	var swiper2 = new Swiper('.qie2 .swiper-container', {
		autoplay: 5000,
		speed: 500,
		loop: true,
		observer:true,
		observeParents:true,
		autoplayDisableOnInteraction : false,
	  });
	$(".qie").hide();;
	swiper1.stopAutoplay(); 
	swiper2.stopAutoplay();
	$('.button').each(function(){
		$(this).click(function(){
			var index=$(this).index();
			$('.btn').hide();
			$(".qie").hide();;
			swiper1.stopAutoplay();
			swiper2.stopAutoplay();
			$('.qie').eq(index).show();
			if(index==0){
				swiper1.startAutoplay();
			}else if(index==1){
				swiper2.startAutoplay();
			}
		})
	});
	$('.return').click(function(){
		$('.qie').hide();
		swiper1.stopAutoplay();
		swiper2.stopAutoplay();
		$('.btn').show();
	})
})()

注意：
1.关于一个页面多个swiper，在new Swiper时最好在.swiper-container前面加上对应的父级，也可以给.swiper-container在加一个class名。
2.关于显示隐藏后发现swiper不自动轮播，此问题的解决方法是同时在建swiper时加入observer:true,observeParents:true（有时候加入这两个就可以了），但这次加入后依然不能自动轮播，此时在隐藏的时候要加上swiper.stopAutoplay();显示的时候加上swiper.startAutoplay();