基于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字典探测用户名工具
Oct 05 Javascript
JavaScript中对象属性的添加和删除示例
May 12 Javascript
jQuery实现的背景动态变化导航菜单效果
Aug 24 Javascript
jQuery+JSON实现AJAX二级联动实例分析
Dec 18 Javascript
基于jQuery实现的幻灯图片切换
Dec 02 Javascript
详解node中创建服务进程
May 09 Javascript
Vue2.0学习之详解Vue 组件及父子组件通信
Dec 12 Javascript
30分钟快速入门掌握ES6/ES2015的核心内容(下)
Apr 18 Javascript
jQuery层叠选择器用法实例分析
Jun 28 jQuery
JS常见面试试题总结【去重、遍历、闭包、继承等】
Aug 27 Javascript
微信小程序 获取手机号 JavaScript解密示例代码详解
May 14 Javascript
Vue和Flask通信的实现
May 19 Vue.js
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
thinkphp实现图片上传功能分享
2014/03/04 PHP
修改WordPress中文章编辑器的样式的方法详解
2015/12/15 PHP
php实现留言板功能(会话控制)
2017/05/23 PHP
php5.x禁用eval的操作方法
2018/10/19 PHP
Laravel 中创建 Zip 压缩文件并提供下载的实现方法
2019/04/02 PHP
php抽象方法和普通方法的区别点总结
2019/10/13 PHP
深入浅析安装PhpStorm并激活的步骤详解
2020/09/17 PHP
Jquery实现显示和隐藏的4种简单方式
2013/08/28 Javascript
javascript date格式化示例
2013/09/25 Javascript
js实现的全国省市二级联动下拉选择菜单完整实例
2015/08/17 Javascript
jQuery.Uploadify插件实现带进度条的批量上传功能
2016/06/08 Javascript
深入理解JS正则表达式---分组
2016/07/18 Javascript
js仿QQ邮箱收件人选择与搜索功能
2017/02/10 Javascript
详解node中创建服务进程
2017/05/09 Javascript
详解vue-cli中配置sass
2017/06/21 Javascript
jQuery.extend 与 jQuery.fn.extend的用法及区别实例分析
2018/07/25 jQuery
vue-router源码之history类的浅析
2019/05/21 Javascript
详解基于Wepy开发小程序插件(推荐)
2019/08/01 Javascript
vue+iview分页组件的封装
2020/11/17 Vue.js
[51:15]2014 DOTA2国际邀请赛中国区预选赛 Orenda VS LGD-GAMING
2014/05/22 DOTA
[50:15]VP vs Mineski 2018国际邀请赛淘汰赛BO3 第二场 8.22
2018/08/23 DOTA
深入理解Python中各种方法的运作原理
2015/06/15 Python
在python的类中动态添加属性与生成对象
2016/09/17 Python
Python实现判断一个整数是否为回文数算法示例
2019/03/02 Python
详解pandas删除缺失数据(pd.dropna()方法)
2019/06/25 Python
使用opencv识别图像红色区域,并输出红色区域中心点坐标
2020/06/02 Python
PySide2出现“ImportError: DLL load failed: 找不到指定的模块”的问题及解决方法
2020/06/10 Python
python读取excel数据并且画图的实现示例
2021/02/08 Python
你正在寻找的CSS3 动画技术
2011/07/27 HTML / CSS
HTML5仿微信聊天界面、微信朋友圈实例代码
2018/01/29 HTML / CSS
多媒体专业自我鉴定
2014/02/28 职场文书
庆七一活动总结
2014/08/27 职场文书
办公室主任岗位职责范本
2015/03/31 职场文书
酒店仓管员岗位职责
2015/04/01 职场文书
Nginx访问日志及错误日志参数说明
2021/03/31 Servers
SQL之各种join小结详细讲解
2021/08/04 MySQL