将变量复制到剪贴板会创建一个我不需要的文本框

Question

我有一个数组，我想在按下 "c" 键并左键单击按钮时将其复制到剪贴板（参见下面的代码）：

        $(document).on('keydown', e => {
            $(document).on('click', d => {
                if (e.keyCode === 67) {
                    var dummyContent = [1, 2, 3];
                    var dummyContentTrue = dummyContent.join(', ');
                    var dummy = $('<input>').val(dummyContentTrue).appendTo('body').select()
                    document.execCommand('copy')
                }
            })
        })

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

如代码所示，它创建了很多我无法在我的页面上显示的文本框，在我放开 "c" 后，这些框不会被删除。我在 $('<input>') 上尝试过 .remove()，但仍然无济于事。

非常感谢任何帮助！（仅供参考，在我的代码片段中，确保按住字母 c 键并同时左键单击以查看结果）。

还有一个仅供参考，我只希望在同时按下 c 键和左键单击时进行复制。如果没有按下c键，我不希望它复制数据。

Answer 1

您需要对一个元素或元素列表调用 .remove()

所以，它应该是 $( "input" ).remove()

或者，您可以将新创建的 input 分配给一个变量，然后对该元素调用 remove

var dummy = $('<input>'); // newly created element
dummy.val(dummyContentTrue).appendTo('body').select()
document.execCommand('copy')
dummy.remove() // remove the element

此外，每次按下键时，都会向 document 添加一个新的 click 处理程序。所以你需要把它从那里移开。

Answer 2

使用keydown记录按键，keyup清除按键（所以只有按住按键才有效）：

var lastkey = 0;
$(document)
  .on('keydown', e => {
    lastkey = e.keyCode;
  })
  .on('keyup', e => {
    lastkey = 0;
  })
  .on('click', d => {
    console.log(lastkey)
    if (lastkey === 67) {
      var dummyContent = [1, 2, 3];
      var dummyContentTrue = dummyContent.join(', ');
      var dummy = $('<input>').val(dummyContentTrue).appendTo('body').select()
      document.execCommand('copy')
    }
  });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

将变量复制到剪贴板会创建一个我不需要的文本框

Copying variable to clipboard creates a text box I don't need

javascript

jquery

copy-paste