ホームページ > ウェブフロントエンド > jsチュートリアル > スライド時にデータの動的ロードが常に失敗する場合はどうすればよいですか?

スライド時にデータの動的ロードが常に失敗する場合はどうすればよいですか?

php中世界最好的语言
リリース: 2018-03-17 13:34:52
オリジナル
2009 人が閲覧しました

今回は、動的にロードされたデータのスライドが常に失敗する場合の対処法について説明します。以下は、動的にロードされたデータのスライドの問題を解決するための注意事項です。

2 つの解決策

1. データをロードした後にスワイパーを初期化します

success:function(result){
var resultdata =eval("("+result+")");
if(resultdata.status == 1){
	var dataList = resultdata.data;
	currentPage = resultdata.currentPage;
	pageCount = resultdata.pageCount;
	var html = "";
	if(pageCount == 0){
		html ='<p class="noCollect">' + resultdata.msg + '</p>';
	}else{
		for(var i in dataList){
			var data = dataList[i];
			html += '<p class="swiper-container artistp">'
			+ '<p class="swiper-wrapper">'
			+ '<p class="swiper-slide workp">'
			+ '<p class="app_inlineBlock workPic">'
			+ '<img class="picImg" src="&#39;+ data.artistAvatar +&#39;" />'
			+ '</p>'+'<p class="app_inlineBlock workInfo">'
			+ '<p class="artistName">' + data.artistName + '</p>'
			+ '<p class="workName">' + data.artworkName + '</p>'
			+ '<p class="workValue">'+ data.typeName +'/'+ data.width + '*' + data.height +'/' +data.createYear + '</p>'
			+ '</p><p class="app_inlineBlockRight workPrice">'
			+ '<p class="price">¥'+ data.marketPrice +'</p></p></p>'
			+ '<p class="swiper-slide delBtn">删除</p></p></p>';
		}
		
	}
	$("#list").append(html);
	//swiper初始化 
	var swiper = new Swiper('.swiper-container', {
		pagination: '.swiper-pagination',
		slidesPerView: 'auto',
		paginationClickable: true,
		spaceBetween: 0
	});
}
ログイン後にコピー

2. スワイパーの初期化に 2 行のコードを追加します

swiper1 = new Swiper('.swiper-container', { 
 initialSlide :0, 
 observer:true,//修改swiper自己或子元素时,自动初始化swiper 
 observeParents:true//修改swiper的父元素时,自动初始化swiper 
});
ログイン後にコピー
この記事など、とても興味深いですね。php 中国語 Web サイトの他の関連記事にも注目してください。

推奨読書:

JS を使用してラジオのステータスを変更する方法


var foo = function () {} と function foo() の違い


ブートストラップ テーブルを次のように設定する方法身長の割合

以上がスライド時にデータの動的ロードが常に失敗する場合はどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート