实时监听 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:微信公 ...
随机推荐
- mysql5.7设置默认的字符集
修改/etc/my.cnf文件 一.在[mysqld]下添加: default-storage-engine=INNODB character-set-server=utf8 collation-se ...
- Eclipse各个版本及其对应代号、下载地址列表【转】
Eclipse各个版本及其对应代号.下载地址列表 Eclipse各个版本及其对应代号.下载地址列表版本号 代码 日期 下载地址Eclipse 3.1 IO[木卫一,伊奥] 2005 http://ar ...
- spring boot 防止重复提交
服务器端实现方案:同一客户端在2秒内对同一URL的提交视为重复提交 上代码吧 pom.xml <?xml version="1.0" encoding="UTF-8 ...
- conda中重要的三个概念:环境、通道和包
基本使用conda必须要了解的三个概念:虚拟环境.通道和包. conda提供了在python环境下重要的编程环境管理功能,包括环境隔离和依赖包管理. 环境隔离通过虚拟环境实现,与此相关的命令有: co ...
- rk3288 usb无线网卡支持 8188eu
第一部分是kernel 内核配置参考rk文档,把device driver 下wireless相关的先勾选上. 编译到buildin有问题,识别不到,所以打算编译成ko cd kernel/driv ...
- Gitlab修改用户密码
sudo gitlab-rails console production > user=User.where(name: "root").first > user.pa ...
- NFS的安装与使用
一.服务器端: 1.1安装NFS服务: #执行以下命令安装NFS服务器, #apt会自动安装nfs-common.rpcbind等13个软件包 sudo apt install nfs-kernel- ...
- Solidity truffle,部署合约到Ropsten测试链或主链,调用合约(转)
Solidity truffle,部署合约到Ropsten测试链或主链,调用合约 转 https://blog.csdn.net/houyanhua1/article/details/89010896 ...
- 学习使用Lombok生成代码
一.介绍 Lombok官网:https://projectlombok.org/ Lombok的功能简单一点说,就是可以帮我们生成一些代码,这些代码并不是在源码(source code)体现出来的,而 ...
- EasyNVR网页H5无插件播放摄像机视频功能二次开发之直播通道接口保活示例代码
背景需求 随着雪亮工程.明厨亮灶.手机看店.智慧幼儿园监控等行业开始将传统的安防摄像头进行互联网.微信直播,我们知道摄像头直播的春天了.将安防摄像头或NVR上的视频流转成互联网直播常用的RTMP.HT ...