jq实现手机自定义弹出输入框
手机涉及到填写表单时,需要手机弹出自定义的输入框,而非手机自带的输入键盘,如大写数字等。

实现思路(考虑多种文本输入形式):
首先,文本框获取焦点时禁止手机弹出自带的输入键盘。
// 禁用手机自带的键盘输入框
function forbidFocus(i){
$('#txt'+i).focus(function(){
document.activeElement.blur();
});
}
其次,显示与关闭自定义的输入键盘。
// 打开自定义输入键盘
function showDialog(i) {
$('#txt'+i).on('click', function(){
$('#num'+i).animate({bottom: "0"}, 'fast');
// 若多种文本输入框时,需隐藏其他的输入键盘
hideDialog(i);
});
} // 关闭自定义输入键盘
function hideDialog(i) {
$('.popup-list').not('#num'+i).animate({bottom: -h + 'px'}, 'fast');
}
最后,点击自定义的输入键盘,做判断使对应的input获取值。
jq实现手机自定义弹出输入框的更多相关文章
- ios输入法弹出输入框定位错乱
弹出输入框会使视口高度发生变化,弹出输入框后动态匹配这个高度 以下是使用jq的方法 $('input').on('blur', function () { setTimeout(function () ...
- js自定义弹出框
js自定义弹出框: 代码如下 <html> <head><title>自定义弹出对话框</title> <style type ="te ...
- android自定义弹出框样式实现
前言: 做项目时,感觉Android自带的弹出框样式比较丑,很多应用都是自己做的弹出框,这里也试着自己做了一个. 废话不说先上图片: 实现机制 1.先自定义一个弹出框的样式 2.自己实现CustomD ...
- JavaScript实现点击按钮弹出输入框,点确定后添加li组件到ul组件里
JavaScript实现点击按钮弹出输入框,点确定后添加li组件到ul组件里 <!doctype html> <html manifest="lab4.manifest&q ...
- CSS3/jQuery自定义弹出窗口
简单演示一下,精简了演示效果和css样式文件,更利于在项目中的实际应用 引入style.css index.js <!DOCTYPE HTML PUBLIC "-//W3C//DT ...
- Python实现使用tkinter弹出输入框输入数字, 具有确定输入和清除功能
Python3.6中用tkinter, 弹出可以输入数字的输入框. # Copyright (c) 2017-7-21 ZhengPeng All rights reserved. def pop_u ...
- react native仿微信性别选择-自定义弹出框
简述 要实现微信性别选择需要使用两部分的技术: 第一.是自定义弹出框: 第二.单选框控件使用: 效果 实现 一.配置弹出框 弹出框用的是:react-native-popup-dialog(Git地址 ...
- Android 弹出输入框
final EditText inputServer = new EditText(SettingActivity.this); AlertDialog.Builder builder = new A ...
- .NET MVC 学习笔记(四)— 基于Bootstarp自定义弹出框
.NET MVC 学习笔记(四)—— 基于Bootstarp自定义弹出框 转载自:https://www.cnblogs.com/nele/p/5327380.html (function ($) { ...
随机推荐
- 《Maven_孔浩》Maven依赖
项目目录结构如下: pom.xml src main\java\zttc\itat\maven\ch02 target pom.xml文件说明 groupId:项目id(如:zt ...
- 对request.getSession(false)的理解(附程序员常疏忽的一个漏洞)--转
出处:http://blog.csdn.net/xxd851116/archive/2009/06/25/4296866.aspx [前面的话] 在网上经常看到有人对request.getSessio ...
- Helpers\SimpleCurl
Helpers\SimpleCurl The SimpleCurl class is there to curl data from RESTful services. A lot of compan ...
- MII、RMII、GMII接口的详细介绍
转载:http://blog.csdn.net/reille/article/details/6312156 概述: MII (Media Independent Interface(介质无关接口)或 ...
- MYSQL基础笔记(七)- 数据类型二
字符串类型 在SQL中,讲字符串类型分成了六类:char,varchar,text,blob,enum,set char,定长字符串 磁盘(二维表)在定义结构的时候,就已经确定了最终数据的存储长度. ...
- oracle数据字典和动态性能视图
数据字典和动态性能视图数据字典是oracle数据库中重要的组成部分,提高了数据库的一些系统信息.(静态信息)动态性能视图记载了例程启动后的信息.(动态信息) 数据字典记录了数据的系统信息,是只读表和动 ...
- ArcGIS Server 10.2 实战(一)Asp.net MVC与JSON数据妙用实现动态生成要素图层
今年7月刚刚发布的ArcGIS 10.2为GIS的web开发带来了一个很实在的功能,JSON转要素.以往GIS图层外部数据(如文本数据,数据库数据)动态地写入地图服务中的图层是一件不可想象的事情,如今 ...
- Objective-C ,ios,iphone开发基础:NSDictionary(字典) 和 NSMutableDictionary
NSDictionary(字典),NSDictionary类似于 .net中的parameter,l类似于java中的map. 通过唯一的key找到对应的值,一个key只能对应一个只,而多个key可以 ...
- java性能
一.关于性能的基本知识 1.性能的定义 在我们讨论怎样提高Java的性能之前,我们需要明白“性能“的真正含义.我们一般定义如下五个方面作为评判性能的标准. 1) 运算的性能----哪一个算法的执 ...
- Git CMD - fetch: Download objects and refs from another repository
命令格式 git fetch [<options>] [<repository> [<refspec>…]] git fetch [<options> ...