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 ($) { ...
随机推荐
- java 对象序列化
java 对象序列化 package org.rui.io.serializable; import java.io.ByteArrayInputStream; import java.io.Byte ...
- apache配置文件
httpd-vhost.conf文件中: <VirtualHost *:80> ServerAdmin webmaster@dummy-host2.example.com Do ...
- 增加字段关联插件 For PHPCMS V9 免费版
增加字段关联插件 For PHPCMS V9 免费版 第一:增加字段选择关联 第二:关联后的效果 烈火下载友情提示:增加方法详见附件内的说明文档. 附件下载
- java_字符
例一:数据类型转换 package javaweb1200; public class 字符就是数字吗 { public static void main(String[] args) { Syste ...
- 普通字符串与Hex编码字符串之间转换
import java.io.UnsupportedEncodingException; import org.apache.commons.codec.binary.Hex; public clas ...
- this的分析分支
最近看到这个题目,开始不太理解,但是仔细的看完this之后,觉得懂了一些 function Foo() { getName = function () { alert (1); }; return t ...
- PHP读书笔记(3)-常量
什么是常量 什么是常量?常量可以理解为值不变的量 :或者是常量值被定义后,在脚本的其他任何地方都不可以被改变.手册上是这么定义PHP的常量:常量是一个简单值的标识符(名字).如同其名称所暗示的,在脚本 ...
- [改善Java代码]建议采用的顺序是 List<T>、List<?>、List<Object>
建议98:建议采用的顺序是 List<T>.List<?>.List<Object> List<T>.List<?>.List<Obj ...
- IOS微信中看文章跳转页面后点击返回无效
经过查找原因发现,下面两种链接,链接1返回不了,链接2可以返回. 链接1:http://mp.weixin.qq.com/s?__biz=MzA5NDY5MzcyNA==&mid=265089 ...
- Android 给应用定制皮肤
Android 给应用定制皮肤 导读:皮肤也就是相关的资源文件单独放置在某个工程中,一种皮肤一个工程文件.一个工程包括N多的资源文件,多个工程间资源的关系是,文件名,资源ID等完全一样. 在实现程序功 ...