JSは対応IDの内容を貼り付け板（Ctrl+C効果）にコピーします。

前言
最近はボタンを押していますが、クリックしたときにurlを貼り付け板にコピーする効果があります。しかし、現在のページurlではなく、一つの要素のurlに対応しています。一つのページに複数のurlがあります。最初に一つの方法を見つけましたが、なんとIEブラウザの互換性しかないという不思議なことに、IE対応のものがありました。その後、ゼロclipboard.jsというプラグインが発見されましたが、どうしてもその効果が出ないので、ちょっと面倒です。
最後にjsパッケージの良い方法をひっくり返しました。効果的です。
実現したい効果の一つは、以下のコードです。

<tr>
 <td>
 <a id="copy_{$key}" onclick="getUrl('{$key}')">      </a>
 <input id="file_{$key}" value="{$file.file_url}" style="margin-left: -9999px"/>
 </td>
</tr> 

コピーしたファイルリンクのこのボタンをクリックして、inputボックスのvalue値をコピーします。転送されたurlです。まずaタグをクリックするとgetUrlという関数が起動されます。IDを送ると、対応するinputを見つけて値を取るために使われます。
以下のjsコード：

<pre><script type="application/javascript">
 
 function getUrl(id) {
  if (copyToClipboard(document.getElementById("file_"+id))){
   alert("        ！");
  }else{
   alert("        ！");
  }
 }
 
 function copyToClipboard(elem) {
  // create hidden text element, if it doesn't already exist
  var targetId = "_hiddenCopyText_";
  var isInput = elem.tagName === "INPUT" || elem.tagName === "TEXTAREA";
  var origSelectionStart, origSelectionEnd;
  if (isInput) {
   // can just use the original source element for the selection and copy
   target = elem;
   origSelectionStart = elem.selectionStart;
   origSelectionEnd = elem.selectionEnd;
  } else {
   // must use a temporary form element for the selection and copy
   target = document.getElementById(targetId);
   if (!target) {
    var target = document.createElement("textarea");
    target.style.position = "absolute";
    target.style.left = "-9999px";
    target.style.top = "0";
    target.id = targetId;
    document.body.appendChild(target);
   }
   target.textContent = elem.textContent;
  }
  // select the content
  var currentFocus = document.activeElement;
  target.focus();
  target.setSelectionRange(0, target.value.length);
 
  // copy the selection
  var succeed;
  try {
   succeed = document.execCommand("copy");
  } catch(e) {
   succeed = false;
  }
  // restore original focus
  if (currentFocus && typeof currentFocus.focus === "function") {
   currentFocus.focus();
  }
 
  if (isInput) {
   // restore prior selection
   elem.setSelectionRange(origSelectionStart, origSelectionEnd);
  } else {
   // clear temporary content
   target.textContent = "";
  }
  return succeed;
 }
</script></pre>

getUrlでパッケージ化されたCopyToClip board法を呼び出して機能を実現しました。一つは、htmlのinputのスタイルをstyle="margin-left:-9999 px"で隠しています。なぜtype="hiden"やdisplay="none"を使って隠してもソースコードだけを取得して、ダイナミックなurl遍歴の値ではありません。
締め括りをつける
以上はこの文章の全部の内容です。本文の内容は皆さんの学習や仕事に一定の助けをもたらしてほしいです。もし疑問があれば、メッセージを残して交流してもいいです。