地址选择功能

  好久以前的工作了,今天才抽出时间来整理一下,免得以后时间久了不记得了。先看看截图

  

  本来之前这是做的一版混合app,后来又开发了一个触屏版的。app框架里面封装好了两个也买之间传值没什么问题的,但是放app里面就只能呵呵了,两个页面怎么传值呢??

我能想到的就两种方案:1.用iframe. 2.使用浏览器本地缓存。使用本地缓存如果用户清除了浏览器缓存怎么办就没了。所以想了一下还是用iframe吧。好了开始行动,噼里啪啦,不一会儿完工了,开开心心的拿来手机测试。惨了,苹果机就出问题了,苹果机下确定按钮因为在iframe中就有半截下去了,还拖都拖不回来。。。好捉急啊。。。

  看了一下iframe全屏用的固定定位,影响到里面的fixed定位了。那就拿出来吧!又噼里啪啦把里面的按钮搬出来吧,还得改js改吧,改吧。。。

拿出来了,按钮好了,继续测试。哎呀!这里怎么有个输入框,fixed定位跟输入框就是冤家,果然不出所料,真的出问题了。输入框获取焦点之后,手机键盘弹出。后面的东西就不听使唤了,固定定位根本就顶不住,定不住啊!!!上网找找资料。。。

  用局对定位代替模拟固定定位。具体做法如下:

  1.iframe:

  /*嵌入的iframe*/
  .Iframe{position: absolute;width: 100%;height:auto;top:0;left: 0;background: #fff;z-index: 10000;display: none;bottom: 0;right: 0;}
  .Iframe iframe{border: none;width: 100%;height: 100%;}

  js给Iframe高度动态赋值。

  2.选择地址iframe后面页div

需要给他的高度动态赋值,同时把overflow:属性设置为hidden;

3.用户选好地址点击确认后关闭iframe弹出框页面,overflow:属性设置为auto。

这就算完了,在找来一大波手机测试一下,安卓,没问题,ios也没问题,挺好,终于可以开开心心下班了~_~ ~_~

时间: 2024-10-14 00:10:34

地址选择功能的相关文章

[ PHP+jQuery ] ajax 多级联动菜单的应用:电商网站的用户地址选择功能 ( 一 ) - 传统下拉菜单

/** jQuery version: 1.8.3 Author: 小dee Date: 2014.11.5 */ 说明:分析其他网站的图片较多,可以在目录跳过直接看本文 demo . 目录: 其他网站分析 亚马逊 淘宝 京东 当当 本文案例 demo1 demo2 [ 后面的博文再写 ] demo3 [ 后面的博文再写 ] 惯例,先看看他山之石,选择了四家比较大的电商网站:亚马逊.淘宝.京东.当当,看看它们的地址联动菜单是怎么做的. 1. 亚马逊[返回目录][下一节:淘宝] 图1 默认界面 说

LArea 微信端 地址选择

最近做到一个项目,微信端的商城需要地址选择功能 在百度上看了,采用LArea.js....下载实例,在移动端模拟器上运行是比较好的, 在微信上模拟后出现很多问题, 1,出现undefined 都定义正确,但是选择器中显示的是undefined,,,这个,是数据不对的原因,数据没找到,直接上代码, var area2 = new LArea(); area2.init({ 'trigger': '#demo2', 'valueTo': '#city', 'keys': { id: 'value',

IBM P系列小型机HMC默认IP地址

IBM小型机通过HMC管理和维护特别的方便和便捷,但是很多情况下,我们不知道后端HMC的管理IP地址. 现将小型机上HMC默认的IP地址记录如下: P5及更旧的机型默认地址为: HMC 0:192.168.2.147 HMC 1:192.168.3.17 P6及更新的机型默认地址为: HMC 0:169.254.2.147 HMC 1:169.254.3.147 通过IP地址我们可以直接网页打开机器的ASMI页面,用户名和密码为admin和admin 如果我们通过HMC来连接的话,HMC服务器默

win7设置固定IP重启后无法上网,ipconfig显示为自动配置IPV4 169.254的地址

近日安装原版Win7系统打完网卡驱动补丁后,给电脑设置了固定的IP地址后一切正常,但是电脑重启后发现上不了网了,右下角网络图标有个感叹号,打开网络和共享中心-->本地连接-->详细信息-->发现IPv4的地址与ipconfig /all得到的IP地址一致,均显示为:自动配置IPv4地址:169.254.123.188(首选) 但是查看本地连接-->属性里看到之前设置的固定IP地址是没有问题的, 所以想到了应该是电脑启用了自动配置IPv4功能,导致了固定IP无法分配给电脑, 尝试用命

linux系统开机静态分配ip地址

在/etc/sysconfig/network-scripts/ifcfg-ens33文件中 添加: IPADDR=192.168.1.1(设置静态地址) 修改: BOOTTPROTO=ghcp(动态分配地址) 为: BOOTTPROTO=static 修改: ONBOOT=no(设置开机启动) 为: ONBOOT=yes 保存并source

【小程序】获取微信 自带的 收货地址获取和整理

1.wx.chooseAddress(OBJECT) if(wx.chooseAddress){ wx.chooseAddress({ success: function (res) { console.log(JSON.stringify(res)) }, fail: function(err){ console.log(JSON.stringify(err)) } }) }else{ console.log('当前微信版本不支持chooseAddress'); } 2.数据处理,仅供参考 /

java web应用用户上传图片的存储地址

原来工程的上传图片存储地址在web应用的目录下,并且是硬编码到其中的: 每次使用maven tomcat:redeploy以后,这个目录就没有了. 现在想要把上传图片的位置移动到tomcat的webapps目录中专门存放图片的一个目录下. 即,新建的一个images目录用来存放web应用的图片们. 这样就把工程和用户上传图片分离了,以后在redeploy时也不用预先备upload目录,然后再拷贝回去,因而在web应该更新时比较方便些.此外,还想改变文件路径被硬编码到java文件中的现状,所以将文

linux文本三剑客匹配网卡IP地址大PK(CentOS 7系统)

    运维工程师在做配置的过程中很多时候都需要去获取目标服务器网卡上的IP地址,那究竟用什么方式获取更便捷了,博主今天就带大家使用linux文本三剑客分别获取一下网卡的IP地址,最后我们再来对比一下. 实验环境: 系统:CentOS 7.2 网卡张数:双网卡 linux文本三剑客之grep 获取ifconfig输出中的IP地址 ifconfig | egrep -o "\<([1-9]|[1-9][0-9]|1[0-9][0-9]|2[0-1][0-9]|22[0-3])\>.(\

MySQL怎样存储IP地址

这两天面试,借贷宝面试官有问到你之前的项目是如何存储ip地址的,我的回答是,存储为varchar字符串类型(事实上我之前参与的项目中的确是采用varchar类型来存储的,但现在想想,当时的场景也仅仅是记录用户操作的地址,也没什么太多用途). 然后,面试官又问我,那你如何查找出A类IP地址的内容,这个时候我就懵了,因为我根本不知道IP地址还分类别,只知道基本格式是从0.0.0.0 ~ 255.255.255 所以,面试也是一种知识的学习,只可惜过程太痛苦,年轻的时候多学点总不是坏处,后悔当初在公司