2025年3月19日 星期三 甲辰(龙)年 月十八 设为首页 加入收藏
rss
您当前的位置:首页 > 计算机 > 编程开发 > JavaScript

JS判断连续输入完成

时间:12-16来源:作者:点击数:44

JS如何判断连续输入完?js判断输入结束可以通过下面这个jquery插件完美实现。

引用js文件(代码见文末)

使用方法:

  • $('#{你的input输入框的id}').donetyping(function () {
  • //输入完成后执行的JS代码
  • });

donetyping.js代码:

  • //
  • // $('#element').donetyping(callback[, timeout=1000])
  • // Fires callback when a user has finished typing. This is determined by the time elapsed
  • // since the last keystroke and timeout parameter or the blur event--whichever comes first.
  • // @callback: function to be called when even triggers
  • // @timeout: (default=1000) timeout, in ms, to to wait before triggering event if not
  • // caused by blur.
  • // Requires jQuery 1.7+
  • //
  • ; (function ($) {
  • $.fn.extend({
  • donetyping: function (callback, timeout) {
  • timeout = timeout || 1e3; // 1 second default timeout
  • var timeoutReference,
  • doneTyping = function (el) {
  • if (!timeoutReference) return;
  • timeoutReference = null;
  • callback.call(el);
  • };
  • return this.each(function (i, el) {
  • var $el = $(el);
  • // Chrome Fix (Use keyup over keypress to detect backspace)
  • // thank you @palerdot
  • $el.is(':input') && $el.on('keyup keypress paste', function (e) {
  • // This catches the backspace button in chrome, but also prevents
  • // the event from triggering too preemptively. Without this line,
  • // using tab/shift+tab will make the focused element fire the callback.
  • if (e.type == 'keyup' && e.keyCode != 8) return;
  • // Check if timeout has been set. If it has, "reset" the clock and
  • // start over again.
  • if (timeoutReference) clearTimeout(timeoutReference);
  • timeoutReference = setTimeout(function () {
  • // if we made it here, our timeout has elapsed. Fire the
  • // callback
  • doneTyping(el);
  • }, timeout);
  • }).on('blur', function () {
  • // If we can, fire the event since we're leaving the field
  • doneTyping(el);
  • });
  • });
  • }
  • });
  • })(jQuery);
方便获取更多学习、工作、生活信息请关注本站微信公众号城东书院 微信服务号城东书院 微信订阅号
推荐内容
相关内容
栏目更新
栏目热门