前端界面不让复制 指定区域能复制

前端防止用户复制指定区域的内容通常通过JavaScript来实现，主要是利用`event.preventDefault()`和`clipboard.writeText()`等API。下面是一个简单的示例：

// 获取需要禁止复制的元素
const sensitiveArea = document.getElementById('sensitive');

sensitiveArea.addEventListener('copy', (event) => {
  // 阻止默认的复制行为
  event.preventDefault();

  // 如果允许特定区域复制，可以在这里添加自定义内容
  const allowedText = '这是一段允许复制的文字';

  // 使用Clipboard API尝试设置允许复制的内容，但浏览器并不保证所有的复制操作都能成功阻止
  try {
    navigator.clipboard.writeText(allowedText);
    alert('已将允许复制的内容复制到剪贴板');
  } catch (err) {
    console.error('复制操作失败:', err);
  }
}, { passive: false }); // 注意：passive属性是为了兼容某些旧版本浏览器

// 如果希望部分区域允许复制，可以在该区域另外处理`copy`事件
let allowCopy = true;
sensitiveArea.addEventListener('contextmenu', (event) => {
  if (!allowCopy) {
    event.preventDefault();
  }
});

在这个例子中，敏感区域的右键菜单会被禁用以防止复制，点击其他地方则只允许复制预设的文本。如果需要让用户只能复制指定部分，可以根据DOM节点的位置做判断。