美文网首页
动态监听输入框值的变化

动态监听输入框值的变化

作者: 嘻洋洋 | 来源:发表于2018-07-25 11:01 被阅读0次

我们有时会需要动态监听输入框值的变化,当使用onkeydown、onkeypress、onkeyup作为监听事件时,会发现一些复制粘贴等操作用不了。专业的解决方案:HTML5标准事件oninput、onchange和IE专属的事件properchange。

1oninput和propertychange事件

input是标准的浏览器事件,一般应用于input元素,当输入框的值发生改变时触发该事件,无论是键盘输入还是鼠标黏贴的改变都能及时监听到变化,重点是oninput是在值改变时立即触发
propertychange:功能同oninput,用以替代oninput在IE9以下的不兼容性。

2onchange事件

onchange是在值改变后失去焦点才触发,并且可以用在非输入框中,如:select等。

3最佳方案

input和propertychange一起使用

    $(".order_discount_item input[type='number']").on("input propertychange", function () {

        var modify = false;
        var value = $(this).val().toString();
        var inputName = $(this).attr("name");
        // 全部虚拟货币只能输入挣整数
        if ((value.length > 0 && /^[1-9]\d{0,6}$/.test(value) == false)) {
            value = value.substr(0, value.length - 1);
            $(this).val(value);
            return;
        } else if (value.length > 0 && /^[0-9]{0,6}\.?[0-9]{0,2}$/.test(value) == false) {
            value = value.substr(0, value.length - 1);
            $(this).val(value);
            return;
        }

相关文章

  • 动态监听输入框值的变化

    我们有时会需要动态监听输入框值的变化,当使用onkeydown、onkeypress、onkeyup作为监听事件时...

  • jQuery之input框

    1、propertychange:实时监听input输入框值的变化事件

  • vue之补充(十一)

    一、什么是计算属性? 计算属性是自动监听依赖值的变化,从而动态返回内容。监听是一个过程,在监听的值变化时,可以触发...

  • jquery和js实时监听input输入框值变化

    jquery和js实时监听input输入框值变化 jquery: $("#input1").bind("input...

  • computed和 watch 的使用场景

    计算属性是自动监听依赖值的变化,动态返回内容,在监听的值变化时,可以触发回调。 computed使用场景:当有一些...

  • 基于vue的搜索框

    1组件:input输入框 Card列表 2 思路:watch 监听input输入框绑定的值 当值发生变化的时候 处...

  • js实现实时监听input输入框值的变化

    要想实现实时监听input输入框值的变化的效果,只需要让input元素监听两个事件:input和propertyc...

  • JS上使用OnPropChanged和OnInput

    此文为转载,可以让自己方便查看。 在 Web应用开发过程中时常会碰到需要动态监听输入框值变化的情况,比如需要用js...

  • jQuery监听输入框的值变化

    监听输入框的键盘事件,在移动端可以使用H5的oninput事件,但在PC端并不是所有浏览器都支持。在PC端,绑定H...

  • EditText 常用方法

    1. addTextChangedListener方法理解 输入框内容变化监听:当输入框内发生变化就会执行 执行顺...

网友评论

      本文标题:动态监听输入框值的变化

      本文链接:https://www.haomeiwen.com/subject/wdfpmftx.html