前天项目有一个需求,在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. BerOS File Suggestion(字符串匹配map)

    BerOS File Suggestion(stl-map应用) Polycarp is working on a new operating system called BerOS. He asks ...

  2. 权限控制框架---shiro入门

    1.shiro控制权限的两种思想:粗粒度url级别,细粒度方法级别 2.shiro执行流程简介 3.案例 3.1shiro控制用户登录实现,登录其实就是shiro中的认证. (1)配置web.xml( ...

  3. js鼠标相关事件

  4. keil mdk5安装

  5. C++ 设置光标问题

    一.隐藏光标 1.引入头文件window.h 2.  定义光标信息结构体变量 CONSOLE_CURSOR_INFO  cursor info={1,0}; typedef struct _CONSO ...

  6. mysql学习笔记--列属性

    一.是否为空----null || not null 二.默认值----default 三.自动增长----auto_increment 四.主键----primary key 1. 主键:唯一标识表 ...

  7. Solidity合约间的调用-1

    当调用其它合约的函数时,可以通过选项.value(),和.gas()来分别指定,要发送的ether量(以wei为单位),和gas值. pragma solidity ^; contract InfoF ...

  8. 20172306 2018-2019 《Java程序设计与数据结构》第一周学习总结

    20172306 2018-2019 <Java程序设计与数据结构(下)>第一周学习总结 教材学习内容总结 第一章 概述 (程序=数据结构+算法 软件=程序+软件工程) 1.1 软件质量 ...

  9. Eclipse 中打开 python 交互窗口

  10. Visual Studio2013 配置opencv3.3.0 x64系统

    注:小白一个,第一次写博客,可能会有一些理解上的错误,只此记录自己测试成功的坎坷之路,已备以后查看,同时给有需要之人. 我是win10 64 位,之前安装了visual studio 2013, 现在 ...