html怎么插动态图片不显示不出来,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(){

不知道有没有什么更好的办法可以解决动态插入图片的问题。

e38b5849f4e67044e69ce5a9a66db10a.gif

我的解决办法是:

点击之前,先把图片data数据弄好

6ffb46c055511a33073cb09ade5ff778.png

把上面的代码改成

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

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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值