javascript - 使用 select() 复制值并复制

Question

我正在尝试选择一个输入，然后将文本复制到输入中，但无法识别子项。

$(".input-group .copyLink").click(function() {
  $(this).parent().find('.htmlLink').select();
  document.execCommand("copy");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="input-group">
  <input type="text" class="htmlLink" value="http://google.cl">
  <button class="copyLink">Copy</button>
</div>
<div class="input-group">
  <input type="text" class="htmlLink" value="http://microsoft.com">
  <button class="copyLink">Copy</button>
</div>
<div class="input-group">
  <input type="text" class="htmlLink" value="http://apple.com">
  <button class="copyLink">Copy</button>
</div>

有什么建议吗？

谢谢!

Answer 1

你可以稍微缩短代码，因为你有一个 div 包装器并且只有一个同级:

$(".input-group .copyLink").click(function() {
  $(this).siblings().select();
  document.execCommand("copy");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="input-group">
  <input type="text" class="htmlLink" value="http://google.cl">
  <button class="copyLink">Copy</button>
</div>
<div class="input-group">
  <input type="text" class="htmlLink" value="http://microsoft.com">
  <button class="copyLink">Copy</button>
</div>
<div class="input-group">
  <input type="text" class="htmlLink" value="http://apple.com">
  <button class="copyLink">Copy</button>
</div>