首页 > 解决方案 > 内容可编辑 div 复制粘贴限制

问题描述

我有一个带有编辑选项的消息框,当用户编辑消息时,我的按键限制设置为 300 个字符,但是当我复制和粘贴时超出了限制,而我的 Jscript 限制代码没有影响。

任何人都可以看到我在下面的代码中哪里出错了。谢谢,麻烦您了。

var ebm=document.getElementById('editSeller'+varmessageid+'');


                        var messbox=$(ebm).text();
                        var messlength = messbox.length;
                        var amount=300;
                        var leftlength=amount-messlength;



                                //delete & backspace keys
                            document.addEventListener('keyup', function(event) {
                                const key = event.key;
                                if (key === "Backspace" || key === "Delete") {

                                 var messbox=$(ebm).text();
                                var messlength = messbox.length;
                                var amount=300;
                                var leftlength=amount-messlength;


                                    if (leftlength <1 ) {leftlength=0
                                    $(ebm).css('border', '1px dashed red');
                                    event.preventDefault();
                                    }
                                        else {
                                        $(ebm).css('border', '1px dashed #07f310');
                                        }



                                $('#CSeller'+varmessageid+'').text('Characters Left: '+leftlength);
                                 }
                            });


 //ascii keys
                             $(ebm).on('keypress', function(e){



                                var messbox=$(ebm).text();
                                var messlength = messbox.length;
                                var amount=299;
                                var leftlength=amount-messlength;


                                    if (leftlength <1 ) {leftlength=0
                                    $(ebm).css('border', '1px dashed red');
                                    e.preventDefault();
                                    }
                                        else  {
                                        $(ebm).css('border', '1px dashed #07f310');
                                        }



                                $('#CSeller'+varmessageid+'').text('Characters Left: '+leftlength);



                            });

标签: htmlkeypressjscript

解决方案


到目前为止,使用 .onpaste 添加了如下另一个功能似乎可以正常工作...

尚未检查浏览器兼容性。

var ebm=document.getElementById('editSeller'+varmessageid+'');

   ebm.onpaste = function(event){
     var messbox=$(ebm).text();
     var messlength = messbox.length;
     var amount=300;
     var leftlength=amount-messlength;


    if (leftlength <1 ) {leftlength=0
     $(ebm).css('border', '1px dashed red');
      event.preventDefault();
       }

       else {
           $(ebm).css('border', '1px dashed #07f310');
          }

        $('#CSeller'+varmessageid+'').text('Characters Left: '+leftlength);
};

推荐阅读