解決 viewer.js 動態更新圖片致使沒法預覽的問題

一、viewer.js 使用 Demohtml

http://fengyuanchen.github.io/viewerjs/git

二、viewer.js 下載地址github

https://github.com/fengyuanchen/viewerjsajax

三、viewer只能初始化一次,也就是說若是用ajax添加了新的圖片,你再初始化新添加的圖片仍是出不來,只有第一次初始化加載的圖片app

四、解決方案工具

參看官方文檔:post

五、具體代碼實例url

 1 $.post('your_url', {
 2     param: 'value'
 3 }, function(data) {
 4     var html = '';
 5     for (var i = data.length - 1; i >= 0; i--) {
 6         html += '<li><img src="img_source" ></li>'
 7     }
 8     $("#img_list").append(html);
 9     // 初始化 viewer.js
10     var viewer = new Viewer(document.getElementById('img_list'), {
11         toolbar: true,  //顯示工具條
12         viewed() {
13             viewer.zoomTo(0.75);   // 圖片顯示比例 75%
14         },
15         show: function (){        // 動態加載圖片後,更新實例
16             viewer.update();
17         },
18     });
19 });     
相關文章
相關標籤/搜索