关键词：
最近要做一个移动前端, 填字的需求, 类似pc上一些程序填写序列号的界面,
填写前: h w o r l d
填写后: h e l l o w o r l d,
界面大概如上图, 在下划线的位置填写对应的序列号, 但是必须保证输入体验的的连续性。
填写字符, 下划线好办, 最开始的思路直接用input来做填写框, css 如下:
.my-input{
width: 12px;
margin-right: 1px;
outline: none;
border: none;
border-bottom: 1px solid black;
font-size: 10pt;
font-weight: bolder;
text-align: center;
color: #818181;
}
消去input 的浏览器默认样式以后, 利用border来模拟出下划线。然后每个小字符的输入框用一个Input来实现, 多个input来实现出需要的ui样式。
然后利用js, keydown事件, 每当用户输入一个字符, 识别keyCode对当前input中的值进行过滤, 就focus到下一个input当中。PC端实现以后运行完美。 然后就是悲剧的开始。
上到移动端以后出现各种问题。
1. 微信浏览器中, 在九宫格键盘输入时, keydown, keyup事件中无法获取到keyCode, which(全部是0)。可以换在input事件中进行input value的重置, 不过这样字符会闪动, 回调是在输入生效以后才发生的, 会看到字符闪动的现象。
2. 在iphone的微信中, 不经过用户的点击, 在keydown, keyup中用js, 调用focus让input获取焦点, 会导致无法弹出软键盘, 原本打开的软键盘也会关闭。
这个坑就比较大了, 试过模拟一个click事件发现还是没用, 暂时没找到好的方法。
好消息是PM让不用管微信, PC上能运行OK就可以。
求网页端的javascript的hmac-sha1加密算法。最近遇到了需要一些加密算法的地方，然而
求网页端的JavaScript的HMAC-SHA1加密算法。最近遇到了需要一些加密算法的地方，然而加密算法很多很杂，而网页端无法调用nodeJS也不支持PHP。求纯JavaScript写的加密算法包，能给出用法实例的更好了！题主可以考虑使用CryptoJS这个... 查看详情
关于微信服务号开发的一些总结！
最近一直在负责开发公司的服务号，并且将来还要做成第三方平台。年末先做一波总结！日常使用的微信服务号点击菜单栏，跳转进入网页中心。第一步，在公众号的后台可以设置菜单的跳转链接。需要注意的是https://open.weixin.q... 查看详情
vue中遇到的一些坑，记录一下
最近用vue开发完成了网页和app的项目试着想记录下遇到的坑，以免下次遇到的时候就轻松解决了一、vue开发pc端1、 cookie不用中文的，和时间格式不要带’/’,否则safari浏览器会报错。这是到目前位置发现在safari的两个大... 查看详情
iPhone、Android 和 Blackberry 的移动开发
...ndBlackberry【发布时间】：2010-10-3013:53:20【问题描述】：我最近偶然发现了PhoneGap，我喜欢这个概念，但我无法在Android应用程序上进行第一次尝试。文档跳过了一些细节，而cmets中挤满了遇到问题的人。有没有人在运行PhoneGap？你... 查看详情
在 iPhone 中查找最近的地点
】在iPhone中查找最近的地点【英文标题】：findnearestplacesiniPhone【发布时间】：2009-10-1009:40:44【问题描述】：您好所有iPhone开发者，我正在开发一个iPhone应用程序。在这个应用程序中，我想找到与我从iPhone设备获取的当前CLLocation... 查看详情
移动端常见的兼容性问题
...lRatio作怪，因为手机分辨率太小，如果按照分辨率来显示网页，这样字会非常小，所以苹果当初就把iPhone4的960*640分辨率，在网页里只显示了480*320，这样 查看详情
移动端兼容
...很大的，我主要记录移动端的一些内容：移动端与web端在网页设计与交互方面的差别移动端注意点一些小技巧移动端的一些问题及解决方法移动端与web端在网页设计与交互方面的差别纯粹是个人看法。 在web端是尽可能地展示... 查看详情
移动端常见的一些兼容性问题
...lRatio作怪，因为手机分辨率太小，如果按照分辨率来显示网页，这样字会非常小，所以苹果当初就把iPhone4的960*640分辨率，在网页里只显示了480*320，这样devicePixelRatio＝2。现在android比较乱，有1.5的，有2的也有3的。想让图片在手... 查看详情
我也遇到了网页代码在微信上不能自动播放背景音乐的问题，你是怎么解决的？
参考技术A根你的手机系统有关系，苹果iso系统有部分网页音乐无法自动播放。这个是网页兼容性的问题，跟你自身手机系统有关。 查看详情
开发新版大番薯牛牛源码过程中遇到需要注意的问题
...的是H5游戏的服务器搭建步骤，希望能有人从中受益！我最近正开发的这套新版大番薯牛牛源码今微信H5牛牛源码（h5.ttkmwl.com）开发出来了，但开发h5页面时间遇到了一些坑。天不负有心人，心累！相信H5的程序员开发微信h5页面... 查看详情
html移动端开发常见的兼容性总结
...lRatio作怪，因为手机分辨率太小，如果按照分辨率来显示网页，这样字会非常小，所以苹果当初就把iPhone4的960640分辨率，在网页里只显示了480320，这样devicePixelRatio＝2。现在android比较乱，有1.5的，有2的也有3的。想 查看详情
开发与 iOS 3 兼容的 iPhone 应用程序是不是有意义？
】开发与iOS3兼容的iPhone应用程序是不是有意义？【英文标题】：DoesitmakeanysensetodevelopiPhoneapplicationcompatiblewithiOS3?开发与iOS3兼容的iPhone应用程序是否有意义？【发布时间】：2011-11-0616:36:03【问题描述】：我正在开发iPhone应用程序... 查看详情
微信小程序开发要求
...程序wxssWxss是微信的css。用自己的开发语言wxss替代了微信网页编程中使用的css，其实主要的实现思路和网页开发技术基本一致，也是一些标签的简单替换。大部分和原来的css基本一样，都是在同一个页面上调用实现的。但是可以... 查看详情
分发 iPhone 应用程序的开发版本
...ion【发布时间】：2009-03-0916:11:03【问题描述】：我的公司最近开始为各种客户开发定制的iPhone应用程序。我们遇到的挑战之一是如何将这些应用程序提供给客户，以便他们在开发过程中对其进行审查。理想情况下，这只是将应用... 查看详情
快使用scriptable自己开发一个iphone小组件吧
最近苹果的iOS系统升级到了iOS14，这次的更新我比较关注的就是升级的小组件功能，这次更新我们可以将小组件放置在主屏幕中的任何位置，可以让我们更加便捷的查看一些信息，从而省去了还需要打开APP去查看消息的步骤，感... 查看详情
提示 iPhone 用户将用 Asp.Net MVC 开发的网页添加到主屏幕
】提示iPhone用户将用Asp.NetMVC开发的网页添加到主屏幕【英文标题】：PromptinganIPhoneusertoaddawebpagedevelopedinAsp.NetMVCtohomescreen【发布时间】：2014-03-0717:44:01【问题描述】：我已经使用Asp.NetMVC设计和开发了一个Web应用程序，并添加了一... 查看详情
最近遇到的一些编程题
一些经典的编程题连续最大子数组#include<iostream>usingnamespacestd;/***gettheindexofmaxsumsubarrayandthesum*@paramarrthegivenarray*@paramlowthelowwerboundofthearray*@paramhightheupperboundofthearray*/voidget_ma 查看详情
微信网页授权流程(前端篇)
功能描述公司最近有个项目要做基于微信的H5校服定制wepApp的开发，之前完全没有接触过微信开发，很是兴奋，有种磨刀霍霍向猪羊的感觉。由于本人经验有项，描述不准确的地方请大家及时指出。功能描述:当用户点击如下所示... 查看详情