基于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进行的DDoS攻击原理与防御
Jun 04 Javascript
javascript弹出拖动窗口
Aug 11 Javascript
javascript单页面手势滑屏切换原理详解
Mar 21 Javascript
运用js教你轻松制作html音乐播放器
Apr 17 Javascript
JavaScript实现邮箱地址自动匹配功能代码
Nov 28 Javascript
浅谈JavaScript中promise的使用
Jan 11 Javascript
js单页hash路由原理与应用实战详解
Aug 14 Javascript
vue中SPA单页面应用程序详解
Nov 07 Javascript
详解vue mixins和extends的巧妙用法
Dec 20 Javascript
jQuery实现标签子元素的添加和赋值方法
Feb 24 jQuery
使用layui实现的左侧菜单栏以及动态操作tab项方法
Sep 10 Javascript
基于vue+echarts数据可视化大屏展示的实现
Dec 25 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
东方红 - 来复式再生机的修复
2021/03/02 无线电
php表单加入Token防止重复提交的方法分析
2016/10/10 PHP
Laravel timestamps 设置为unix时间戳的方法
2019/10/11 PHP
jQuery 表格工具集
2010/04/25 Javascript
javascript打印输出json实例
2013/11/11 Javascript
ie与ff下的event事件使用介绍
2013/11/25 Javascript
js 金额格式化来回转换示例
2014/02/23 Javascript
JavaScript定义类和对象的方法
2014/11/26 Javascript
PHP+mysql+Highcharts生成饼状图
2015/05/04 Javascript
jQuery实现类似淘宝网图片放大效果的方法
2015/07/08 Javascript
微信小程序 教程之WXML
2016/10/18 Javascript
js多个物体运动功能实例分析
2016/12/20 Javascript
解决Vue编译时写在style中的路径问题
2017/09/21 Javascript
详解webpack的proxyTable无效的解决方案
2018/06/15 Javascript
对Vue2 自定义全局指令Vue.directive和指令的生命周期介绍
2018/08/30 Javascript
七行JSON代码把你的网站变成移动应用过程详解
2019/07/09 Javascript
vue通过数据过滤实现表格合并
2020/11/30 Javascript
vue实现扫码功能
2020/01/17 Javascript
让IDE识别webpack的别名alias的实现方法
2020/05/06 Javascript
[04:46]2018年度玩家喜爱的电竞媒体-完美盛典
2018/12/16 DOTA
Python实现的简单hangman游戏实例
2015/06/28 Python
使用Python中的tkinter模块作图的方法
2017/02/07 Python
Python基于正则表达式实现文件内容替换的方法
2017/08/30 Python
python代码实现ID3决策树算法
2017/12/20 Python
Django 2.0版本的新特性抢先看!
2018/01/05 Python
Python Grid使用和布局详解
2018/06/30 Python
TensorFlow实现模型评估
2018/09/07 Python
Python告诉你木马程序的键盘记录原理
2019/02/02 Python
Django model 中设置联合约束和联合索引的方法
2019/08/06 Python
python实现网站用户名密码自动登录功能
2019/08/09 Python
Scrapy框架实现的登录网站操作示例
2020/02/06 Python
New Era英国官网:美国棒球帽品牌
2018/03/21 全球购物
汇科协同Java笔试题
2012/03/31 面试题
护士长竞聘演讲稿
2014/04/30 职场文书
小学教师师德师风自我剖析材料
2014/09/29 职场文书
试用期解除劳动合同通知书
2015/04/16 职场文书