基于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 相关文章推荐
jQuery 页面载入进度条实现代码
Feb 08 Javascript
跟我一起学写jQuery插件开发方法(附完整实例及下载)
Apr 01 Javascript
jQuery实现简单的文件上传进度条效果
Mar 26 Javascript
图解js图片轮播效果
Dec 20 Javascript
JS简单获取当前年月日星期的方法示例
Feb 07 Javascript
基于JS实现网页中的选项卡(两种方法)
Jun 16 Javascript
Javascript防止图片拉伸的自适应处理方法
Dec 26 Javascript
微信小程序实现留言板(Storage)
Nov 02 Javascript
mpvue实现小程序签到金币掉落动画(api实现)
Oct 17 Javascript
Element Backtop回到顶部的具体使用
Jul 27 Javascript
Vue 电商后台管理项目阶段性总结(推荐)
Aug 22 Javascript
vue3种table表格选项个数的控制方法
Apr 14 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
PHP文件操作实例总结
2016/09/27 PHP
B/S开发中常用javaScript技术与代码
2007/03/09 Javascript
发两个小东西,ASP/PHP 学习工具。 用JavaScript写的
2007/04/12 Javascript
详细讲解JS节点知识
2010/01/31 Javascript
jQuery Study Notes学习笔记 (二)
2010/08/04 Javascript
javascript 单例/单体模式(Singleton)
2011/04/07 Javascript
查看大图功能代码jquery版
2013/11/05 Javascript
jQuery 顶部导航跟随滚动条滚动固定浮动在顶部
2014/06/06 Javascript
探讨js字符串数组拼接的性能问题
2014/10/11 Javascript
轻松创建nodejs服务器(7):阻塞操作的实现
2014/12/18 NodeJs
Redis基本知识、安装、部署、配置笔记
2015/03/05 Javascript
jQuery Ajax 加载数据时异步显示加载动画
2016/08/01 Javascript
模板视图和AngularJS之间冲突的解决方法
2016/11/22 Javascript
原生js编写焦点图效果
2016/12/08 Javascript
微信小程序 this和that详解及简单实例
2017/02/13 Javascript
Vue.js render方法使用详解
2017/04/05 Javascript
Vue生命周期示例详解
2017/04/12 Javascript
对vue中v-on绑定自定事件的实例讲解
2018/09/06 Javascript
vuejs中监听窗口关闭和窗口刷新事件的方法
2018/09/21 Javascript
vue 获取视频时长的实例代码
2019/08/20 Javascript
jQuery实现简单飞机大战
2020/07/05 jQuery
python使用urllib2实现发送带cookie的请求
2015/04/28 Python
python 对类的成员函数开启线程的方法
2019/01/22 Python
使用Python-OpenCV向图片添加噪声的实现(高斯噪声、椒盐噪声)
2019/05/28 Python
Python 中@property的用法详解
2020/01/15 Python
使用Pycharm在运行过程中,查看每个变量的操作(show variables)
2020/06/08 Python
css3+jq创作含苞待放的荷花
2014/02/20 HTML / CSS
CSS3中background-clip和background-origin的区别示例介绍
2014/03/10 HTML / CSS
华硕新加坡官方网上商店:ASUS Singapore
2020/07/09 全球购物
消防器材管理制度
2014/01/28 职场文书
大学生心理活动总结
2014/07/04 职场文书
苏州园林导游词
2015/02/03 职场文书
2015年教师见习期工作总结
2015/05/20 职场文书
初二数学教学反思
2016/02/17 职场文书
四十九个javascript小知识实用技巧
2021/11/20 Javascript
详解CSS3浏览器兼容
2022/12/24 HTML / CSS