如何使用右键单击检测文本是否已粘贴

How can I detect if text is paste using right-click

本文关键字:是否 文本 检测 何使用 右键 单击      更新时间:2023-09-26
如果我使用 ctrl c 和 ctrl v 在表 1 上粘贴文本

(例如在"Apple"上),表 2 上输入的重复文本仍然会更改,但是如果我使用右键单击和粘贴粘贴,表 2 上的重复输入不会更改。 :(我创建了两个不同的事件(键控和更改),但是当使用右键单击粘贴文本时,似乎没有任何效果。请看下面:

按键小提琴演示

$(document).off('keydown').on('keydown', $('#table1 tbody tr td input:eq(0)'), function (e) {
var oldValue =$(e.target).val();//get the input value before keypress or edit
    $(document).on('keyup', $('#table1 tbody tr td input'),function(e){ 
        $('#table2').find('td input').each(function(){
            if($(this).val() === oldValue){
                $(this).val($(e.target).val());
            }
        $(document).off('keyup');
        });
    });              
});

关于更改小提琴演示

var oldValue;
$(document).on('keydown', '.main', function (e) {
    oldValue = $(this).val();
    foo(oldValue);
});
var newValue;
$(document).on('keyup', '.main', function (e) {
    newValue = $(this).val();
    foo(oldValue);
});
function foo(oldValue) {
    $('#table1').find('tbody tr').find('td input').change(function (i) {
        var orig = $(this).val();
        $('#table2 tbody tr').find('td input').each(function (i) {
            if (oldValue == $(this).val()) {
                $(this).val(orig);
            }
        });
    });
}

您可以在更改上计算字符数(因为一次只能输入一个字符。

编辑:

为什么它不起作用:

在你的JSFIDDLE上,请记住在框架和扩展中设置onDomReady,相当于$(document).ready(handlerFn)

当您对输入使用 on('change', handlerFn).change(handlerFn) 时,它只会在文本框失去焦点 ( blur ) 后触发。响应不像在表单上使用select那样即时。对输入使用 bind("input", handlerFn) 而不是 on(change)

下面的代码将更新 #table2 上的匹配单词,从 #table1 上编辑的单词更新。更新将适用于复制粘贴 CTRL C/V 或鼠标复制/粘贴事件。如果用户通过比较旧值和新值的长度进行复制/粘贴,它还会发出警报。

$("#table1 >* input").each(function() {
    var elem = $(this),
    oldValue;
    elem.on('focus', function () {
        elem.data('oldVal', elem.val());
        elem.data('oldLen', elem.data('oldVal').length);
    });
    // Look for changes in the value, 
    // bind 'input' event to the textbox to fire the function
    // every time the input changes (paste, delete, type etc.)
    elem.bind("input", function(event){
        oldValue = elem.data('oldVal');
        // update oldVal
        elem.data('oldVal', elem.val());
        // check if pasted
        if (elem.val().length - elem.data('oldLen') > 1 ) {
            alert('Most certainly pasted');
        }
        // update input value length
        elem.data('oldLen', elem.data('oldVal').length);
        // update #table2
       foo(oldValue, elem.val()) ;
    });
});

以及更新 #table2 的功能

function foo(oldValue, newValue) {
    $('#table2')
      .find('input')
      .each(function (i) {
          if (oldValue === $(this).val()) {
              $(this).val(newValue);
          }
      });
}

这是一个JSFIDDLE供您玩

检查此代码,希望对您有所帮助:

jQuery('#some_text_box').on('input propertychange paste', function() {
    var text1 = $('#some_text_box').val();
    //alert(text1);
    $('#tab2').val(text1);
});

这是您的第一个文本框#some_text_box

<input type='text' value = "Apple" id='some_text_box' />

这是表 2 文本框#tab2

<input type='text' value="Apple" id='tab2'/>

JSFiddle

好的,

这将为您检测用户是否使用 Ctrl + V 等,但仅此而已。如果他们右键单击并粘贴,那么您将需要另一个表达式来捕获它。我通过使用keydownkeyup将其保持打开状态,以便您可以在需要时捕获更多变体。

这是jQuery,所以你需要库来涵盖这一点。

$(document).ready(function()
{
    var ctrlDown = false;
    var ctrlKey = 17, vKey = 86, cKey = 67;
    $(document).keydown(function(e)
    {
        if (e.keyCode == ctrlKey) ctrlDown = true;
    }).keyup(function(e)
    {
        if (e.keyCode == ctrlKey) ctrlDown = false;
    });
    $("#no-copy-paste").keydown(function(e)
    {
        if (ctrlDown && (e.keyCode == vKey || e.keyCode == cKey)) return false;
    });
});

这是一篇关于处理程序的文章,也可能对您有所帮助。http://unixpapa.com/js/key.html

-埃皮克