textarea的事件分析
场景:因业务需要,当用户向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); } }); } });
浙公网安备 33010602011771号