layer插件layer.photos()動態插入的圖片無法正常顯示

layer插件layer.photos()動態插入的圖片無法正常顯示,點擊后面插入的圖片，顯示的是之前的圖片列表，再次點擊又是正常

 

有朋友遇到同樣的問題

http://fly.layui.com/jie/4124.html

layer v2.4 彈層組件
layer.photos動態插入圖片后，點擊新插入的圖片會彈出插入前的最后一張圖片。
如果再次調用layer.photos，點擊新圖片會提示錯誤：

layer.js:1006 Uncaught TypeError: Cannot read property 'src' of undefined

現在的解決辦法是在layer.js中的第902行的

loop || parent.on('click', options.img, function(){

改為

loop || parent.off('click').on('click', options.img, function(){

不知道有沒有什么更好的辦法可以解決動態插入圖片的問題。

 

 

 

我的解決辦法是：

點擊之前，先把圖片data數據弄好

把上面的代碼改成

     loop || parent.on('click', options.img, function(){

 pushData();

       var othis = $(this), index = othis.attr('layer-index'); 
       layer.photos($.extend(options, {
         photos: {
           start: index,
           data: data,
           tab: options.tab
         },
         full: options.full
       }), true);
     })

解決！！

這樣改后，無論是增加圖片，還是移除圖片，效果正常

 

使用tips：

1.如果需要重復執行layer.photos()，避免重復創建遮罩，可以加上id參數避免重復創建！

//調用示例
layer.photos({
  id: 'img',
  photos: '#layer-photos-demo'
  ,anim: 5 //0-6的選擇，指定彈出圖片動畫類型，默認隨機（請注意，3.0之前的版本用shift參數）
}); 

 

2. layer.photos()，options.photos參數最好使用頁面上存在DOM結構，因為是使用事件委托綁定的事件。