实时监听 JavaScript改变 input 值 input输入框内容 value 变化实时监听
思路:通过setInterval()方法去定时对比新旧值
当时候JavaScript的onchange 和onpropertychange(注意ie版本) 监听输入框input时间,人为改变值是可以触发这2个事件的,但是一旦js去改变了就不能实时监听值得改变
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<script src="http://www.jq22.com/jquery/jquery-3.3.1.js"></script>
</head>
<body>
<input value="123" id="myInput" />
</body>
<script >
$(function(){
var value=$("#myInput").val()
setInterval(function(){
/**
*1、隔200ms比较一次值
*2、注意JavaScript == 和===的区别
*3、三目运算符 ?: 可以接函数调用
*/
value === $("#myInput").val() ? doSomething() : console.log("changed !!!"),
value=$("#myInput").val();
},200)
setInterval(function(){//仅仅为了模拟JavaScript改变了值
$("#myInput").val("123123");
},2000)
function doSomething(){
console.log("no changed !!!")
}
});
</script>
</html>
实时监听 JavaScript改变 input 值 input输入框内容 value 变化实时监听的更多相关文章
- input长度随输入内容动态变化 input光标定位在最右侧
<input type="text" onkeydown="this.onkeyup();" onkeyup="this.size=(this. ...
- PIE SDK栅格图层渲染变化事件监听
1. 功能简介 通过PIE SDK加载图层后,会默认的赋值给数据一个渲染.当用户重新给数据赋值Render或改变数据显示效果时,会触发渲染变化事件. 所谓的事件监听是在事件触发时,将执行用户指定的函数 ...
- TextWatcher-监听输入框内容变化
今天在做邮件登录的时候,遇到了输入框(Edittext)监听事件(TextWatcher),现在记录下. 首先看如下代码 eText.addTextChangedListener(new TextWa ...
- 原生js监听input值改变事件
哈哈哈,又来了,今天闲来无事,实验了下原生js监听input value值改变事件,下面就来说道说道: 本来写监听input值便获是用jquery的,之前的随笔写了,就是这个方法,地址:http:// ...
- 实时监听input输入框value的变化:
HTML5 标准事件 oninput 和 IE 专属事件 onpropertychange 事件实时监听输入框value的变化 oninput 事件在用户输入时触发. 该事件在 <input&g ...
- 原生js监听input值发生变化
原生JS中可以使用oninput,onpropertychange,onchange oninput,onpropertychange,onchange的用法 1) onchange 触发事件必须满足 ...
- input输入框内容变化实时监听
js实现的文本框内容发生改变立马触发事件简单介绍:本章节介绍一下如何在文本框的内容发生变化的时候,立马触发一个事件执行响应的操作,而不是像是keydown或者keyup事件一样,只能够检测通过键盘输入 ...
- onchange监听input值变化及input隐藏后change事件不触发的原因与解决方法(设置readonly后onchange不起作用的解决方案)
转自:https://www.cnblogs.com/white0710/p/7338456.html 1. onchange事件监听input值变化的使用方法: <input id=" ...
- 移动端(html5)微信公众号下用keyup实时监控input值的变化无效
搜索框依据用户输入的值实时检索,一开始自然而然想到keyup,在拼音状态时,啥问题也没有, 问题1:切换到中文输入法,问题出来了,keyup事件不灵便了,后来在网上搜了下,找到了思路, 问题2:微信公 ...
随机推荐
- 服务器收不到支付宝notify_url异步回调请求的问题排查
小背景 最近在调整支付宝支付的功能时发现,不能够正常接收支付宝付款成功之后的回调通知了,从代码到配置最后到服务器配置都排查了一遍,最终发现问题原因竟然是因为我们的回调地址notify_url是http ...
- 20189220 余超《Linux内核原理与分析》第四周作业
构造一个简单的Linux系统MenuOS 第三章基础知识 计算机的三大法宝:存储计算机,函数调用堆栈,中断. 操作系统的两把宝剑:中断上下文,进程上下文. Linux内核源码的目录结构: arch目录 ...
- 第10组 Beta冲刺(5/5)
链接部分 队名:女生都队 组长博客: 博客链接 作业博客:博客链接 小组内容 恩泽(组长) 过去两天完成了哪些任务 描述 将数据分析以可视化形式展示出来 新增数据分析展示等功能API 服务器后端部署, ...
- jmeter测试 flask 接口请求
jmeter测试 flask 接口请求 flask的代码如下: #!/usr/bin/env python # -*- coding: utf-8 -*- from flask import Flas ...
- Activiti6 应用安装 activiti-admin,activiti-app,activiti-rest
activiti6安装包中 1/直接将三个war包放入tomcat中,即可运行,使用H2内存数据库 2/使用mysql数据库运行 2.1/activiti-admin # security confi ...
- 【面试】c++单例模式
1. 单例模式 #include <iostream> using namespace std; class CSingleton { private: CSingleton() {} / ...
- ubuntu下MySQL忘记密码重置方法
方法一: 1):编辑mysqld.cnf文件 sudo vi /etc/mysql/mysql.conf.d/mysqld.cnf 2):在文件中的skip-external-locking一行的下面 ...
- [简短问答]lodop打印过慢或有进度条
问法1:打印预览显示进度条,过慢出现进度条,打印过慢,可能和很多原因有关:打印内容或样式或图片等过多,有需要下载有脚步执行或本身网络慢:机器性能过低 系统ie有问题或缓存过多:或使用的是共享打印机.如 ...
- AC与AP的安装使用(未经实战,仅供参考,未完待续)
AC:无线控制器(Wireless Access Point Controller) AP:无线访问接入点(WirelessAccessPoint) 以信锐AC为例 AC设备的管理口为MANAGE(E ...
- [LeetCode] 210. Course Schedule II 课程安排II
There are a total of n courses you have to take, labeled from 0 to n - 1. Some courses may have prer ...