基于layer.js实现收货地址弹框选择然后返回相应的地址信息


Posted in Javascript onMay 26, 2017

先给大家展示下效果图:

基于layer.js实现收货地址弹框选择然后返回相应的地址信息
基于layer.js实现收货地址弹框选择然后返回相应的地址信息
基于layer.js实现收货地址弹框选择然后返回相应的地址信息

核心代码如下所示:

(‘.selectaddress').click(function () {//图一联系方式中的点击事件 
    top.layer.open({ 
      id: “layer_say_hello”, 
      type: 2, 
      title: ‘请点击选择联系地址', 
      shadeClose: true, 
      shade: 0.8, 
      area: [‘300px', ‘400px'], 
      content: “{:Url(‘/mobile/user/address_list')}”, //iframe的url 
      success: function (layero, index) { 
//        var jquerySendHelloButton =(“.addre span”, layero.find(“iframe”)[0].contentWindow.document); 
var jquerySendHelloButton = (“.listdetail”,layero.find(“iframe”)[0].contentWindow.document);(jquerySendHelloButton).click(function () { 
var addressid = (this).find(‘.addressId′).val();varconsignee=(this).find(‘.contact span').eq(0).text(); 
var phone = (this).find(‘.contactspan′).eq(1).text();varaddre=(this).find(‘.addre span').text(); 
(‘.contactspan′).eq(0).text(consignee);(‘.contact span').eq(1).text(phone); 
(‘.addrespan′).eq(0).text(addre);(‘input[name=address_id]').val(addressid); 
(‘.selec′).css(‘display′,′none′);(‘.demand_add').css(‘display','block'); 
layer.close(index); 
})
      //传入参数,并赋值给iframe的元素
    }
  });
})

以上所述是小编给大家介绍的基于layer.js实现收货地址弹框选择然后返回相应的地址信息,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript中Math对象使用说明
Jan 16 Javascript
js 图片轮播(5张图片)
Dec 30 Javascript
关于jQuery对象数据缓存Cache原理以及jQuery.data详解
Apr 07 Javascript
节点的插入之append()和appendTo()的用法介绍
Jan 13 Javascript
用console.table()调试javascript
Sep 04 Javascript
Js实现自定义右键行为
Mar 26 Javascript
footer定位页面底部(代码分享)
Mar 07 Javascript
基于vue.js轮播组件vue-awesome-swiper实现轮播图
Mar 17 Javascript
Angular2仿照微信UI实现9张图片上传和预览的示例代码
Oct 19 Javascript
详解webpack babel的配置
Jan 09 Javascript
详解angular分页插件tm.pagination二次触发问题解决方案
Jul 20 Javascript
react实现同页面三级跳转路由布局
Sep 26 Javascript
jQuery导航条固定定位效果实例代码
May 26 #jQuery
mongoose中利用populate处理嵌套的方法
May 26 #Javascript
Angularjs修改密码的实例代码
May 26 #Javascript
详解vue.js的devtools安装
May 26 #Javascript
详解Vue.js基于$.ajax获取数据并与组件的data绑定
May 26 #Javascript
vue.js获取数据库数据实例代码
May 26 #Javascript
详解通过JSON数据使用VUE.JS
May 26 #Javascript
You might like
PHP程序员编程注意事项
2008/04/10 PHP
攻克CakePHP系列三 表单数据增删改
2008/10/22 PHP
php判断一个数组是否为有序的方法
2015/03/27 PHP
List Information About the Binary Files Used by an Application
2007/06/18 Javascript
不要小看注释掉的JS 引起的安全问题
2008/12/27 Javascript
ejs v9 javascript模板系统
2012/03/21 Javascript
网页源代码保护(禁止右键、复制、另存为、查看源文件)
2012/05/23 Javascript
javascript数组去重3种方法的性能测试与比较
2013/03/26 Javascript
js css后面所带参数含义介绍
2013/08/18 Javascript
使用jQuery实现返回顶部
2015/01/26 Javascript
js获取当前日期时间及其它操作汇总
2015/04/17 Javascript
JavaScript学习笔记之ES6数组方法
2016/03/25 Javascript
js自调用匿名函数的三种写法(推荐)
2016/08/19 Javascript
基于Javascript实现文件实时加载进度的方法
2016/10/12 Javascript
Angular企业级开发——MVC之控制器详解
2017/02/20 Javascript
Node.js 使用request模块下载文件的实例
2018/09/05 Javascript
对类Vue的MVVM前端库的实现代码
2018/09/07 Javascript
在nuxt中使用路由重定向的实例
2020/11/06 Javascript
[01:33]一分钟玩转DOTA2第三弹:DOTA2&DotA快捷操作大对比
2014/06/04 DOTA
wxpython 学习笔记 第一天
2009/03/16 Python
python中如何使用朴素贝叶斯算法
2017/04/06 Python
python Web flask 视图内容和模板实现代码
2019/08/23 Python
python 的 openpyxl模块 读取 Excel文件的方法
2019/09/09 Python
用Python去除图像的黑色或白色背景实例
2019/12/12 Python
Pytorch .pth权重文件的使用解析
2020/02/14 Python
基于HTML5的WebGL实现json和echarts图表展现在同一个界面
2017/10/26 HTML / CSS
前台文员的岗位职责
2013/11/14 职场文书
英文自我鉴定
2013/12/10 职场文书
车间班组长的职责
2013/12/13 职场文书
旅游文化节策划方案
2014/06/06 职场文书
学校四群教育实施方案
2014/06/12 职场文书
学校清明节活动总结
2014/07/04 职场文书
银行委托书范本
2014/09/28 职场文书
优秀班主任推荐材料
2014/12/17 职场文书
工作经验交流材料
2014/12/30 职场文书
python中pymysql包操作数据库方法
2022/04/19 Python