实时监听input标签输入 实时监听文本框输入 避免中文输入法无法触发onkeyup事件的问题
前言:
对于实时监听输入,这种需求大多数都是用于一个联想字提醒,智能提醒。大家都知道onkeydown,onkeypress,onkeyup的在监听中文输入法或者右键粘贴的时候都存在一些弊端,不是那么完美。
Demo:
Html5提供了一个标准事件oninput和IE的专属事件onpropertychange事件来监听输入值的变化。
<html>
<head>
<title>搜索</title>
</head>
<body>
<input type="text" id="search_input">
<span id="inputorp_s"></span> <script src="./jquery.js"></script>
<script>
$(function () {
//判断浏览器是IE?
if (navigator.userAgent.indexOf("MSIE") != -1) {
$('#search_input').bind('propertychange', getSmartTips);
} else {
$('#search_input').bind('input', getSmartTips);
}
}); function getSmartTips() {
$('#inputorp_s').text($(this).val());
//todo:用ajax去后台拿智能联想数据
}
</script>
</body>
</html>
实时监听input标签输入 实时监听文本框输入 避免中文输入法无法触发onkeyup事件的问题的更多相关文章
- 苹果手机输入中文不会触发onkeyup事件
今天同事的项目有这个问题,用我的安卓手机输入中文是ok的,但是苹果手机就不行 使用keyup事件检测文本框内容: $('#keyup_i').bind('keyup', function(){ ...
- 实时监听文本框输入 oninput、onchange与onpropertychange事件的用法和区别
前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数.过去一般都使用onchange/onkeyup/onkeypress/onke ...
- vue监听input标签的value值方法
<input id="materialSearch" type="text" @keyup.enter="search" @input ...
- 【学习】文本框输入监听事件oninput
真实项目中遇到的,需求是:一个文本框,一个按钮,当文本框输入内容时,按钮可用,当删除内容时,按钮不可用. 刚开始用的focus和blur, $(".pay-text").focus ...
- 监听文本框输入oninput和onpropertychange事件
前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框动态显示还可以输入的字数.过去一般都使用onchange/onkeyup/onkeypress/onkeydow ...
- 监听文本框输入开发仿新浪微博限制输入字数的textarea插件
监听文本框输入 Firefox.Chrome.IE9,IE10 均支持 oninput 事件,此外所有版本的 IE 均支持 onpropertychange 事件. oninput 事件在用户输入.退 ...
- input在输入中文时所触发的事件(防止输入中文时重复执行)
一般在监听文本框输入时监听文本内容改变事件,可以使用oninput和onchange事件,两者区别在于oninput在文本输入状态可以一直监听变化,onchange在文本框失去焦点时才会触发,所以要想 ...
- JS和vue文本框输入改变p标签的内容测试
文本框输入,p标签的内容自动变成文本框的内容,如下是三种方法的测试: 方法1:JS里的onchange,当文本框内容改变事件,该事件里写的方法是,获取p标签本身,然后获取文本框的值,赋值给变量,最后给 ...
- jQuery实现限制input框 textarea文本框输入字符数量的方法
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- hibernate jar包介绍
Hibernate3.jar 这个是hibernate最主要的jar包 ant-1.63.jar Ant 的核心包,在构建Hibernate 时会用到 antlr-2. ...
- Svm相关
Svm相关: 1) SVM方法是通过一个非线性映射p,把样本空间映射到一个高维乃至无穷维的特征空间中(Hilbert空间),使得在原来的样本空间中非线性可分的问题转化为在特征空间中的线性可分的问题. ...
- 69个微信小程序常见问题
本文转自 遇到小程序方面的问题,该去哪里提问呢? 若是能得到微信官方的解答,想必是最叫人安心的.而微信也确实提供了这么一个地方. 在微信公众平台的开发者社区,就置顶了一个「小程序常见问题 FAQ」帖. ...
- java Thread和Runable的深刻理解
线程(Thread)是指程序的运行流程,多线程机制指同时运行多个程序块. Java中实现多线程有两种方法:继承Thread类:实现Runnable接口. Thread类的run()方法的制定者:接口R ...
- category类别中添加属性
p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px Menlo; color: #c91b13 } p.p2 { margin: 0.0px 0. ...
- curl javaSSm框架中传入json数组的格式方法
curl与java结合传入get.post,head请求, 比如: curl的地址: curl -l 127.0.0.1:8080/spacobj/core/do?acid=100 -H " ...
- Maven——快速入门手册(学习记录)
前言: 前段时间进行了一点maven的入门学习,在这里做个记录,希望能帮到一些正在学习的朋友们.maven版本为3.3.9.希望大家觉得好的点个赞,觉得不好的多提提意见和建议做个交流.这里也贴出我学习 ...
- 配置远程服务器,使hyper-v能够连接网络
一般远程服务器只有一个网卡和IP,如果你要在服务器上装虚拟机,那么要使虚拟机能够连接网络,必须要创建虚拟交换机. 如果创建虚拟交换机并桥接,那么就会改变IP地址,改变IP地址,就连接不上远程服务器.造 ...
- Android 7.0 调取系统相机崩溃解决android.os.FileUriExposedException
一.写在前面 最近由于廖子尧忙于自己公司的事情和OkGo(一款专注于让网络请求更简单的网络框架) ,故让LZ 接替维护ImagePicker(一款支持单.多选.旋转和裁剪的图片选择器),也是处理了诸多 ...
- IOS各种手势操作实例
先看下效果 手势相关的介绍 IOS中手势操作一般是 UIGestureRecognizer 类的几个手势子类去实现,一般我们用到的手势就这么5种: 1.点击 UITapGestureRecogniz ...