场景:因业务需要,当用户向textarea粘贴内容时对内容处理回显;textarea不支持change事件;

js依赖:jquery

方案一:

  绑定keyup事件,过滤掉方向键、删除键、回车键,这样可以满足大部分需求,用户可以在textarea内修改任意内容,光标不受影响,能达到数据处理回显,可是当用户用鼠标右键粘贴不能达到预定要求;

方案二:

  绑定keyup、paste事件,根据事件类型分别处理;如果是keyup事件依然过滤特殊键(方向键等),如果是paste事件直接处理,遇到的问题是并没有数据处理回显;经过调试发现,paste事件是先执行响应函数后粘贴内容,因此利用setTimeout函数可以解决该问题;

代码:

$(function () {
        var $paste = $('.paste-code');
        if ($paste) {
            $paste.on('keyup paste', function (e) {
                if (e.type == 'keyup' && $.inArray(e.keyCode, [37, 38, 39, 40, 8, 13]) < 0) {
                    $paste.val(Q.pages.paste_precut($paste.val()));
                } else {
                    setTimeout(function () {
                        $paste.val(Q.pages.paste_precut($paste.val()));
                    }, 10);
                }
            });
        }
    });

 

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2021-11-24
  • 2023-03-20
  • 2022-12-23
  • 2021-07-09
  • 2022-12-23
  • 2021-09-12
猜你喜欢
  • 2022-12-23
  • 2021-03-28
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-12-29
  • 2022-12-23
相关资源
相似解决方案