<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>js中文输入法字符串截断</title>

</head>

<body>

    <p>

        <input type="text" class="title-input">

        <span class="title-length"></span> /

    </p>

    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>

    <script>

        $(function () {

            var titleInput = $(".title-input"),

                titleLength = $(".title-length");

            titleInput.on("keyup", function () {

                var text = $.trim(titleInput.val());

                titleInput.val(text);

                titleLength.html(text.length);

            }).on("input propertychange", function () {

                var text = $.trim(titleInput.val());

                text.length >  && titleInput.val(text.substring(, ));

            }).on("compositionstart", function () {

                $(this).prop("comStart", true);

                console.log("中文输入start");

            }).on("compositionend", function () {

                $(this).prop("comStart", false);

                console.log("中文输入end");

            });

        });

    </script>

</body>

</html>

1、事件input(ie9+)、 propertychange(ie8-) 用来监听用户的输入；
字母、数字是没问题的，但是中文输入法时候不同浏览器表现不同，有的浏览器会在输入拼音时就会进入判断；

2、复合事件composition event(ie9+),用于处理IME的输入序列：

（1）compositionstart：在IME的文本复合系统打开时触发，表示要开始输入了。

（2）compositionupdate：在向输入字段中插入新字符时触发。

（3）compositionend：在IME的文本复合系统关闭时触发，表示返回正常键盘的输入状态。

js中文输入法字符串截断的更多相关文章

  1. 解决js中文输入法无法触发onkeyup事件问题(转)

    当监听一个input的keyup的事件的时候,英文输入法的情况下可以实时的通过keyup事件检测到文本框value的变化,但是当输入法变成中文后,input的keyup事件就不会被正常触发. onin ...

  2. JS对输入判断变化屏蔽中文输入法输入时连续触发事件的方法

    代码如下: //智能搜索提示 IntelligenceSearch: function IntelligenceSearch() { $('#keyWord').on('input', functio ...

  3. js如何判断当前文本的输入状态——中文输入法的那些坑

    相信各位在平时接需求的时候肯定会遇到这样的一些需求,例如,要求输入框限制输入长度,限制输入类型,限制只能英文输入,限制只能输入大写字母等等,这时候我们一般的思路无非两种,一种是弹出特定的键盘,第二种是 ...

  4. 【干货】JS版汉字与拼音互转终极方案，附简单的JS拼音输入法

    前言 网上关于JS实现汉字和拼音互转的文章很多,但是比较杂乱,都是互相抄来抄去,而且有的不支持多音字,有的不支持声调,有的字典文件太大,还比如有时候我仅仅是需要获取汉字拼音首字母却要引入200kb的字 ...

  5. JS版汉字与拼音互转终极方案，附简单的JS拼音输入法

    原文:http://www.cnblogs.com/liuxianan/p/pinyinjs.html 前言 网上关于JS实现汉字和拼音互转的文章很多,但是比较杂乱,都是互相抄来抄去,而且有的不支持多 ...

  6. [转载]fullPage.js中文api 配置参数~

    fullPage.js中文api 配置参数 选项 类型 默认值 说明 verticalCentered 字符串 true 内容是否垂直居中 resize 布尔值 false 字体是否随着窗口缩放而缩放 ...

  7. JavaScript 汉字与拼音互转终极方案 附JS拼音输入法

    转:http://www.codeceo.com/article/javascript-pinyin.html 前言 网上关于JS实现汉字和拼音互转的文章很多,但是比较杂乱,都是互相抄来抄去,而且有的 ...

  8. JS.中文乱码，Jsp\Servlet端的解决办法

    JS.中文乱码,Jsp\Servlet端的解决办法 2010-03-08 15:18:21|  分类: Extjs |  标签:encodeuricomponent  乱码  urldecoder   ...

  9. 类似baidu搜索 修正jquery的autocomplete在firefox下不支持中文输入法的bug

    解决方法:

随机推荐

  1. make、makefile、cmake、qmake对比

    作者:玟清链接:https://www.zhihu.com/question/27455963/answer/36722992来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出 ...

  2. (转）JavaWeb学习之Servlet（二）----Servlet的生命周期、继承结构、修改Servlet模板

    [声明] 欢迎转载,但请保留文章原始出处→_→ 文章来源:http://www.cnblogs.com/smyhvae/p/4140466.html 一.http协议回顾: 在上一篇文章中:JavaW ...

  3. BZOJ4681 : [Jsoi2010]旅行

    将边按权值从小到大排序. 考虑一条路径,一定是最大的若干条边和最小的相应的没选的边进行交换. 这会导致存在一个分界线$L$,交换之后恰好选中前$L$小的边,且只允许$>L$的边与$\leq L$ ...

  4. Flask实例化配置

    template_folder :指定模板存放路径,默认值:temolates from flask import Flask, url_for app = Flask(__name__,templa ...

  5. python之组合与重用性

    1 组合 组合的概念:软件重用的重要方式除了继承之外还有另外一种方式,即:组合 组合指的是,在一个类中以另外一个类的对象作为数据属性,称为类的组合 >>> class Equip: ...

  6. Column 'u_id' in field list is ambiguous

  7. mybatis --- 如何相互转换逗号分隔的字符串和List

    如果程序员想实现某种功能,有两条路可以走.一条就是自己实现,一条就是调用别人的实现,别人的实现就是所谓的API.而且大多数情况下,好多“别人”都 实现了这个功能.程序员有不得不在这其中选择.大部分情况 ...

  8. 连接postgres特别消耗cpu资源而引发的PostgreSQL性能优化考虑

    由于是开发阶段,所以并没有配置postgres的参数,都是使用安装时的默认配置,以前运行也不见得有什么不正常,可是前几天我的cpu资源占用突然升高.查看进程,发现有一个postgres的进程占用CPU ...

  9. 好用好玩的Python包

    ujson 用C++实现的json解析器,速度飞快. prettytable 在控制台下使用表格展示数据 import prettytable t=prettytable.PrettyTable([' ...

  10. MATLAB 按条件进行加和

    用 find 命令仅仅是找到元素的序号. 这里使用sum 直接选取数组中的元素然后进行加和: a=[ ; ; ; ]; b=sum(a(a>=));