首页 > 其他 > 详细

layer插件layer.photos()动态插入的图片无法正常显示

时间:2017-03-03 01:25:23      阅读:2042      评论:0      收藏:0      [点我收藏+]

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结构,因为是使用事件委托绑定的事件。

 

layer插件layer.photos()动态插入的图片无法正常显示

原文:http://www.cnblogs.com/modestFrank/p/6493118.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!