通过定时监听input框来实现onkeyup事件-
问题:因为zepto无法使用onkeyup 事件
解决方法:通过给input框绑定focus 事件,定时的去监听input的值得改变,在鼠标移出input后,清除定时器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input id="box" type="text">
<script type="text/javascript" src="http://cdn.bootcss.com/zepto/1.1.4/zepto.js"></script>
<script type="text/javascript">
// ## 问题:因为zepto无法使用onkeyup 事件
// ## 解决方法:通过给input框绑定focus 事件,定时的去监听input的值得改变,在鼠标移出input后,清除定时器
Zepto(function(){
controlTime = function(){
var time = setInterval(monitor,100);
$("#box").bind("blur",function(){
clearInterval(time);
})
}
monitor = function(){
var val = $("#box").val();
if(val != ''){
val = val.replace(/\D/g,'');
$("#box").val(val)
console.log(val);
}
}
$("#box").bind("focus",controlTime);
});
</script>
</body>
</html>
通过定时监听input框来实现onkeyup事件-的更多相关文章
- 监听input框变化,即时搜索 compositionstart, compositionend
前话: 如果直接通过input监听, 它是键盘输入按键按下了就触发时间,这样可能导致一些问题,比如在谷歌浏览器想输入中文输入不了: 解决方案: 用 compositionstart 和 composi ...
- JS监听input框的回车事件、属性值改变事件
一.介绍 在程序猿门的工作中,经常会遇见一些表单数据的提交,对于有表单的东西而言,input输入框是非常常见的,所以对于一些input的基本事件,我们需要去掌握 二.input的监听enter事件 比 ...
- angular4 监听input框输入值的改变
angular中一般控件会有change事件,但是如果某些控件没有这个事件 我们如何监听值的变化呢? 对于双向绑定的值,当值改变后监听事件有如下写法: 1. 如果是ngModel可以用ngModelC ...
- 利用原生JS实时监听input框输入值
传送门https://www.cnblogs.com/lantinggumo/p/7636715.html 传送门https://www.cnblogs.com/nailc/p/8572226.htm ...
- jQuery监听文本框值改变触发事件(propertychange)
完整代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...
- 时时监听input内容的改变
心得:我们都知道input有一个change事件,但是是在input元素失去焦点的时候发生,不能时时的监听input内容的改变. 刚开始的时候我是想用setInterval设置计时器的原理定时监听in ...
- JS,JQ及时监听input值的变化,MUI的input搜索框里的清除按钮的点击监听事件
JS: document.getElementById("input对象的ID").addEventListener('input',function(){ console.log ...
- 复选框 省市区 联动(监听input的change事件)
需求:省市区三级包含复选框按钮以及文字描述.点击文字显示对应的下级地区,点击复选框选择对应的下级区域勾选. 分析:监听input的change事件当点击复选框省 选择对应的第一个市区,同时默认选中第 ...
- js 实时监听input中值变化
注意:用到了jquery需要引入jquery.min.js. 需求: 1.每个地方需要分别打分,总分为100; 2.第一个打分总分为40; 3.第二个打分总分为60. 注意:需要判断null.&quo ...
随机推荐
- 白书P61 - 点集配对问题
白书P61 - 点集配对问题 状压DP #include <iostream> #include <cstdio> #include <cstring> using ...
- C# winform自定义Label控件使其能设置行距
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.D ...
- [Jacky] 解决Ext.Net GridPanel 选择的行数据刷新后不能获取最新值
选择GridPanel中一行数据,当变更数据时并重新刷新之后不能获取最新值,需通过如下方式获取: var internalId = gridPanel.getSelectionModel().getL ...
- 解决 EF 分层查询的一个性能问题[转]
前两年帮朋友 做了个网吧管理软件,采用动软的三层架构 sql语句生成的.最近因功能变更 要改动,而我这段正在做asp.net mvc +ef+autofac的一个电商网站.索性 就把原来的底层全重新了 ...
- HW1.2
public class Solution { public static void main(String[] args) { System.out.println("Welcome to ...
- POJ1163 The Triangle: 倒三角形问题
经典的DP问题,DP思想也很直接: 直接贴代码: #include<iostream> #include<cstdio> #include<algorithm> # ...
- 100个常用的linux命令
1,echo “aa” > test.txt 和 echo “bb” >> test.txt //>将原文件清空,并且内容写入到文件中,>>将内容放到文件的尾部 2 ...
- hdoj 1977 Consecutive sum II
Consecutive sum II Time Limit: 3000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Other ...
- 【腾讯Bugly干货分享】手游热更新方案xLua开源:Unity3D下Lua编程解决方案
本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:http://mp.weixin.qq.com/s/2bY7A6ihK9IMcA0bOFyB-Q 导语 xL ...
- layer (jQuery弹出层插件)使用
$(".delete").click(function(){ var work_name = $(this).data('name'); var item_id = $(this) ...