前天项目有一个需求，在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() 的区别

     

 

使用onpaste粘贴事件引起的探索的更多相关文章

  1. 转载JQuery绑定鼠标粘贴事件工具类

    // 粘贴事件监控 $.fn.pasteEvents = function( delay ) { if (delay == undefined) delay = 10; return $(this). ...

  2. js粘贴事件paste简单解析及遇到的坑

    在用户执行粘贴操作的时候,js能够获得剪切板的内容,本文讨论一下这个问题. 目前只有Chrome支持获取剪切板中的图片数据.还好需要这个功能的产品目前只支持Chrome和Safari,一些Chrome ...

  3. ASP.NET jQuery 随笔 在TextBox里面阻止复制、剪切和粘贴事件

    当用户要输入一些密码.信用卡信息和银行账号等敏感信息,用户更希望手工通过键盘敲入数据,而好过通过剪贴板复制粘贴. 我们先来看下实现后的效果: <%@ Page Language="C# ...

  4. 如何屏蔽ctrl + v 粘贴事件，鼠标右键粘贴事件

    通常在自己的APP里的密码框,验证码框需要屏蔽复制,粘贴,怎么办呢? 有三种方法: 1 hook 此方法是最完全的,但由于hook是全局的,容易影响到其它代码. 2 子类化文本框, 重写OnPaste ...

  5. js复制粘贴事件

    一.相应的事件 copy: 在发生复制操作时触发. beforecut: 在发生剪切操作 前 触发. cut: 在 发生 剪切 操作 时 触发. beforepaste: 在 发生 粘贴 操作 前 触 ...

  6. uedit，检测粘贴事件，替换粘贴内容

    vue.editor.addListener("beforepaste",function(type, arg1, arg2){arg1.html="ddddddd&qu ...

  7. 怎么使用zepto.js的tap事件引起的探索

    前言:   在使用zepto.js之前,你首先要知道它是什么?为什么要使用它?以及它和jquery有什么区别? ①:简单来说zepto是一个轻量级的针对现代高级浏览器的JavaScript库, 它与j ...

  8. Android View的事件分发机制探索

    概述 Android事件传递机制也是Android系统中比较重要的一块,事件类型有很多种,这里主要讨论TouchEvent的事件在framework层的传递处理机制.因为对于App开发人员来说,理解f ...

  9. angularjs 粘贴事件

    参考 http://www.jb51.net/article/89708.htm ng-paste 需要setTimeout,否则无法获取到数据

随机推荐

  1. ubuntu彻底卸载软件

    找到此软件名称,然后sudo apt-get purge ......(点点为为程序名称),purge参数为彻底删除文件,然后sudo apt-get autoremove,sudo apt-get ...

  2. 剑指offer例题——链表中倒数第K个结点

    题目描述 输入一个链表,输出该链表中倒数第k个结点. 编程过程 此处采用两个指针依次后移的方法来求解,首先,用一个指针移到第k个位置,之后将第二个指针放在第一位,与第二个指针一同移动,当第二个指针移动 ...

  3. Microsoft DQS sqlException 0x80131904 - SetDataQualitySessionPhaseTwo

    遇到这个问题的原因可以从报错信息看出来,大概率是.net framework的问题 可以尝试如下解决途径 1. regenerate .net Assemble for DQS 2. 如果步骤一无法解 ...

  4. Linux的nmon监控结果分析文件中网络分析NET

    1.首先,使用# ifconfig查看Linux系统中的网卡名称,有的是eth0,有的是em1,以查看结果为准,下图为em1 2.先试试Linux系统中有没有安装ethtool工具,没有的话,下载et ...

  5. (转)在T-SQL语句中访问远程数据库

    https://www.cnblogs.com/lgx5/p/7821887.html 1.启用Ad Hoc Distributed Queries 在使用openrowset/opendatasou ...

  6. jeesite 下载ckfinder上传的文件

    在需要下载的位置,将以下代码复制到页面最下方,就可以实现文件下载了 <script> $(document).ready(function() { var fileName = $(&qu ...

  7. 通过windows远程桌面连接CentOS系统

    前提: CentOS安装桌面,如果无桌面,请执行 # yum -y groups install "GNOME Desktop" # startx 1 2 配置源 # yum in ...

  8. Percentage&Last zero&Convert from char to float

    Percentage g_rate = wg_header-rate. condense g_rate. SHIFT g_rate RIGHT DELETING TRAILING '0'. REPLA ...

  9. CentOS 下用 Nginx 和 uwsgi 部署 flask 项目

    前几天利用flask 写了几个调用salt-api 的接口,需要上线到正式环境,搜了一下 都是 用 nginx + uwsgi 来部署,这里记录下关键的配置项. 1.首先将代码上传到服务器上目录为: ...

  10. 2018-2019-2 20175234 实验一 Java开发环境的熟悉（Linux + IDEA）

    目录 20175234 实验一 Java开发环境的熟悉(Linux + IDEA) 第一部分 代码及运行结果截图 第二部分 要求 代码及截图 第三部分 题目 需求分析 设计 程序及运行结果 问题和解决 ...