使用SweetAlert实现复制功能时第5次触发Uncaught TypeError错误求助

核心原因 #

select()方法是仅<input>和<textarea>元素才有的原生DOM方法，报错说明你点击第5个按钮时，$('#' + copyTextarea)[0]获取到的不是这两类元素——哪怕copyTextarea的值正确为5，只要目标元素类型不对，调用select()就会触发错误。

排查步骤 #

1. 检查第5个目标元素类型：查看页面中ID为5的元素，确认它是不是<input>或<textarea>。如果是<div>、<span>这类普通文本元素，直接调用select()肯定会报错。
2. 验证元素ID唯一性：在浏览器控制台执行console.log($('#5')[0])，看输出的元素是不是你预期的目标元素。如果输出null或者其他非目标元素，说明循环生成时第5个元素的ID设置有误，或者页面上存在重复ID的元素。

解决方案 #

如果目标元素是普通文本元素（非input/textarea），替换原来的复制逻辑，用Selection API实现复制：

// 替换你原来的 $('#' + copyTextarea)[0].select(); 及后续复制代码
const targetEl = document.getElementById(copyTextarea);
// 创建选区并选中元素内容
const range = document.createRange();
range.selectNodeContents(targetEl);
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
// 执行复制
document.execCommand('copy');
// 清除选中状态，避免页面残留选中样式
selection.removeAllRanges();

// 然后再调用SweetAlert提示复制成功
swal("复制成功!", "", "success");

如果目标元素确实是input/textarea，那检查循环生成代码，确保第5个元素的ID正确设置为5，且没有和页面其他元素ID重复。

内容的提问来源于stack exchange，提问作者Allen