zoukankan      html  css  js  c++  java
  • 使用onpaste粘贴事件引起的探索

      前天项目有一个需求,在Excel文档里面直接复制商品编码,然后粘贴到页面空白处就把相应的数据加载出来。当时我是懵逼的,不知道如何下手。

      以前没遇到过类似的需求,后来才想起onpaste事件

     

      在使用onpaste事件时遇到了2个问题:

      第1个问题:jquery绑定onpaste事件以后,如何能获取到粘贴之后的值?

      解决方法:使用如下代码即可原文出处

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <body> I have a textarea, on paste to that textarea I want to <textarea id="content" cols="50" rows="5"></textarea> </body> <script src="js/jquery-1.11.3.js"></script> <script> jQuery(function($) { $('#content').bind('paste', function(e) { var pastedText = undefined; if(window.clipboardData && window.clipboardData.getData) { // IE pastedText = window.clipboardData.getData('Text'); } else { pastedText = e.originalEvent.clipboardData.getData('Text'); //e.clipboardData.getData('text/plain'); } alert(pastedText); }); }); </script> </html>  

      

      第2个问题在下图空白处按ctrl+v以后右下角会提示要先输入客户名称,但是要按2次ctrl+v,右下角的弹框才出来;

                 而且只有第一次需要按2次,如果刷新页面或者按第3次ctrl+v以后就可以直接弹出来了,如下图:

       解决方法在经过多次测试之后,我发现是绑定事件的问题,这里不应该用bind,或者on,应该用live

            (这里使用on的话也可以解决这个问题,但是会出现另一个问题,所以没用)

             很多文章建议停止使用.live()方法,因为它已经被弃用了,并存在一些问题,

             目前我也不知道是什么原因导致这个问题,我只有使用这个方法才能解决这个问题)

        注:详解jQuery中 .bind() -.live() - .delegate() - .on() 的区别

             详解jQuery中 .bind() -.live() - .delegate() - .on() 的区别

           

     

  • 相关阅读:
    Kubernetes 集群日志管理
    登录功能通用测试用例设计
    Linux常用命令大全
    查看Android应用包名、Activity的几个方法
    CentOS 7 下Docker的安装
    Centos7.1下Docker的安装-yum方法
    appium+Java+testng自动化框架搭建-第一季
    Android在Win10环境搭建
    List<Map<String, Integer>> 同key的value全部累加合并
    Restrictions用法
  • 原文地址:https://www.cnblogs.com/tu-0718/p/7017903.html
Copyright © 2011-2022 走看看