通过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 ...
随机推荐
- apache开源项目--hadoop
Hadoop 是一个分布式系统基础架构,由Apache基金会开发.用户可以在不了解分布式底层细节的情况下,开发分布式程序.充分利用集群的威力高速运算和存储.Hadoop实现了一个分布式文件系统(Had ...
- 南阳理工OJ 15 括号匹配
思路:动态规划,设dp[i][j]表示第i个字符到第j个字符所需要的最少匹配数,则:(1),如果从第i到j-1个字符中没有一个与第j个字符匹配,那么状态转移方程为 dp[i][j] = dp[i][j ...
- Windows Azure 基本操作手册
http://www.cnblogs.com/sennly/p/4139663.html 基本测试信息 登陆地址:https://manage.windowsazure.cn(Azure管理门户,适用 ...
- HW2.24
import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...
- HDOJ-ACM1018(JAVA)
题意: 求n!的位数,0<n<10^7 思路:log10(1)+log10(2)+···+log10(n) = log10(n!) [题目的考点就在这吧] 解题: import jav ...
- python seq
missing parentheses in call to print ==> python高版本 print("") name 'raw_input' is not d ...
- UVALive 5111 Soccer Teams (动态规划)
题意:给指定数量的数字“1”,“2”,“3”……,“9”.用所有这些数字加上任意个0组成一个数,要求数能被11整除,且数的位数尽量小. 能被11整除的数有一个特点,奇数位数字之和与偶数位之和的差为11 ...
- A Tour of Go Range
The range form of the for loop iterates over a slice or map. package main import "fmt" , , ...
- 使用 Infragistics 的 NetAdvantage 组件时替换部分菜单语言的方法
Infragistics 的 NetAdvantage 组件很好用,不过有些自动的菜单默认都是英文的,一直想替换成中文,以下就是研究了一下午整出来的几行代码,貌似网上很难找到此类的相关资料,替换的资源 ...
- JBPM学习(一):实现一个简单的工作流例子全过程
test.png test.jpdl.xml <?xml version="1.0" encoding="UTF-8"?> <process ...