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 ($) { ...
 
随机推荐
- ios开发——实战Swift篇&简单项目的实现
			
学了这么久的swift语法和相关技术,今天忍不住手痒痒就写了一个swift的小项目,这个项目非常简单(只是使用一个UITableView),但是里面的功能却非常有用. 我们要实现的功能是这样的: 程序 ...
 - Jquery 表格固定表头
			
网上找了好多现成的.结果没一个能成.只得自己动手. (function($){ $.fn.fixHeader = { init : function(obj){ var p = obj.parent( ...
 - Linux下vim配置详解
			
转自http://www.cnblogs.com/witcxc/archive/2011/12/28/2304704.html
 - 已知json类型根据类型封装集合
			
1编写帮助类根绝url得到json public static string Post(string url) { string strURL = url; //创建一个HTTP请求 HttpWebR ...
 - C++_归并排序(纯C版)
			
#include <iostream> #include <stdlib.h> using namespace std; int compared(const void *ke ...
 - 源码分析shiro认证授权流程
			
1. shiro介绍 Apache Shiro是一个强大易用的Java安全框架,提供了认证.授权.加密和会话管理等功能: 认证 - 用户身份识别,常被称为用户“登录”: 授权 - 访问控制: 密码加密 ...
 - Magical Forest
			
Problem Description There is a forest can be seen as N * M grid. In this forest, there is some magic ...
 - Java设计模式13:常用设计模式之桥接模式(结构型模式)
			
1. Java之桥接模式(Bridge Pattern) (1)概述: 首先我们说一个生活中的例子: 就拿汽车在路上行驶的来说.即有小汽车又有公共汽车,它们都不但能在市区中的公路上行驶,也 ...
 - Objective-C ,ios,iphone开发基础:使用第三方库FMDB连接sqlite3 数据库,实现简单的登录
			
第一步:下载第三方库,点击 连接 下载, 第二部:准备数据库:按照连接&中博客的步骤实现数据库, 数据库的设计大致如下表: id username pas ...
 - Centos6.4安装Mono和MonoDevelop
			
Mono官方网站:http://www.mono-project.com MonoDevelop官方网站:http://monodevelop.com/ 注:整个安装过程最好在同一个终端下完成! ...