js点击复制文本内容

Posted 2020-12-21 深lin人不知

　　没啥好说的，直接上代码：

/**
 * 复制文本内容
 * @param {*} cpStr 需要复制的文本内容
 */
function copyString (cpStr) {
  var orderNum = cpStr;
  // 数字没有 .length 不能执行selectText 需要转化成字符串
  var textString = orderNum.toString();
  var input = document.querySelector(‘#copy-input‘);
  if (!input) {
    input = document.createElement(‘input‘);
    input.id = "copy-input";
    input.readOnly = "readOnly";        // 防止ios聚焦触发键盘事件
    input.style.position = "absolute";
    input.style.left = "-1000px";
    input.style.zIndex = "-1000";
    document.body.appendChild(input)
  }

  input.value = textString;
  // ios必须先选中文字且不支持 input.select();
  selectText(input, 0, textString.length);
  console.log(document.execCommand(‘copy‘), ‘execCommand‘);
  if (document.execCommand(‘copy‘)) {
    document.execCommand(‘copy‘);
    utils.toasts(‘复制成功‘);
  }
  input.blur();

  // input自带的select()方法在苹果端无法进行选择，所以需要自己去写一个类似的方法
  // 选择文本。createTextRange(setSelectionRange)是input方法
  function selectText(textbox, startIndex, stopIndex) {
    if (textbox.createTextRange) {//ie
      var range = textbox.createTextRange();
      range.collapse(true);
      range.moveStart(‘character‘, startIndex);//起始光标
      range.moveEnd(‘character‘, stopIndex - startIndex);//结束光标
      range.select();//不兼容苹果
    } else {//firefox/chrome
      textbox.setSelectionRange(startIndex, stopIndex);
      textbox.focus();
    }
  }
}


// 复制单号
$(‘#copy-btn‘).on(‘click‘, function () {
  var copyString = ‘123456‘;
  // 复制文本内容
  copyString(copyString);
})

　　ios和android都是可以使用的~