通过js实时检测文本框内容
思路
1,在获取文本框焦点后,启动定时器,每隔100毫秒来查看文本内容的改变
2,在文本框失去焦点后,清除定时器
下面是一个简单的例子
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>input 监听</title>
</head>
<body>
<label>
<span>姓名</span>
<input id="input" type="text">
</label>
<p id="input-tip"></p>
<script type="text/javascript" src="http://cdn.bootcss.com/jquery/2.2.1/jquery.min.js"></script>
<script type="text/javascript">
$("#input").focus(function(){
time = setInterval(function(){
var value = $("#input").val();
$("#input-tip").text(value);
console.log("setInterval");
},100);
}).blur(function(){
console.log("clearInterval");
clearInterval(time);
})
</script>
</body>
</html>

通过js实时检测文本框内容的更多相关文章
- JS实时检测文本框内容长度
通过js代码实时监测,文本框内容的变化以及长度,下图是一个实际使用场景. HTML部分: <input id="Text1" type="text" on ...
- js监听文本框内容变化
js监听文本框内容变化 原理很简单,就是在外部先声明一个用来记录input值的变量,然后每0.1秒比较这个值与input的值,如果发生改变,则运行自己的代码,同时改变变量.从而实现对input值改变的 ...
- JS来推断文本框内容改变事件
oninput,onpropertychange,onchange的使用方法 onchange触发事件必须满足两个条件: a)当前对象属性改变,而且是由键盘或鼠标事件激发的(脚本触发无效) b) ...
- JS、JQury - 文本框内容改变事件
例子: 效果: 前端代码: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="De ...
- js 实时计算文本框字数限制
$.fn.myTarea = function(){ return this.each(function(){ $(this).bind('input propertychange', functio ...
- 同步文本框内容的JS代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js获取子节点和修改input的文本框内容
js获取子节点和修改input的文本框内容 js获取子节点: $("#"+defaultPVItemId).children().eq(3); //获取某个选择器下的第四个子节点 ...
- JS和vue文本框输入改变p标签的内容测试
文本框输入,p标签的内容自动变成文本框的内容,如下是三种方法的测试: 方法1:JS里的onchange,当文本框内容改变事件,该事件里写的方法是,获取p标签本身,然后获取文本框的值,赋值给变量,最后给 ...
- JS事件 文本框内容改变事件(onchange)通过改变文本框的内容来触发onchange事件,同时执行被调用的程序。
文本框内容改变事件(onchange) 通过改变文本框的内容来触发onchange事件,同时执行被调用的程序. 如下代码,当用户将文本框内的文字改变后,弹出对话框"您改变了文本内容!&quo ...
随机推荐
- NuGet -- 使用控制台管理程序包
为什么要使用控制台管理程序包而不使用程序包管理窗口?原因大家都懂,生活压力这么大,一切都只是为了装一波.开个玩笑,当然不只是此原因,在有些情况下,有些操作使用程序包管理窗口不能达到目的,只能使用控制台 ...
- 安装qc 出现error An error occurred while attempting to connect to the database.
When trying to install mercury quality center starter edition 9.0 on Windows XP media center, I am g ...
- Spark的几种运行模式
1.local单机模式,结果xshell可见:./bin/spark-submit --class org.apache.spark.examples.SparkPi --master local[1 ...
- S3C2440触摸屏驱动实例开发讲解
出处:http://www.embeddedlinux.org.cn/html/yingjianqudong/ 一.开发环境 主 机:VMWare--Fedora 9 开发板:Mini2440--6 ...
- 五指CMS发布,主打高性能
近日,五指CMS正式发布.给沉静已久的国内 CMS 行业引来不少的关注.五指CMS由原PHPCMS v9的负责人王参加主导开发.我们可以看到,由于移动互联网以及大数据的崛起,个人站长市场的逐渐减少,国 ...
- SharePoint 命令使用集锦 (持续更新中...)
首先要定位到 cd "Program Files\Common Files\Microsoft Shared\web server extensions\14\BIN" 下面 ...
- 冒泡算法(C++模板实现)
冒泡排序 从整体上看,冒泡排序是一种稳定排序,即排序完成后,原本序列中的键值相等的元素相对位置不会发生改变.算法的时间复杂度是O(n2),空间复杂度为O(1),即这是一个"就地算法" ...
- HDU4763 - Theme Section(KMP)
题目描述 给定一个字符串S,要求你找到一个最长的子串,它既是S的前缀,也是S的后缀,并且在S的内部也出现过(非端点) 题解 CF原题不解释....http://codeforces.com/probl ...
- 注册表-各种功能-隐藏IE、隐藏硬盘、禁用硬件
1.在[我的电脑]上隐藏软驱 在[开始]→[运行]→输入[Regedit]→[HKEY_CURRENT_USER]→[Software] →[Microsoft] →[Windows]→[Curren ...
- oc学习之路----QQ聊天界面
用到的技术:自定义cell,通知机制,代理模式 transform 1.自定义cell(通过代码自定义cell) ①首先新建一个类继承UITableViewCell ②重写initWithStyle: ...