使用 Jquery 查找 Parent 兄弟姐妹第一个 Child 的第一个 Child

Question

我正在尝试在此处使用 JS 和 Jquery 的组合来 select 输入文本（前面的几个元素），当单击按钮时。

我只知道如何使用 JS 来做到这一点，但我想了解如何使用 jQuery 来做到这一点。我在控制台中收到错误消息：TypeError: ele.setSelectionRange is not a function。我认为这意味着它没有按照我需要的方式定义输入值。

我在这里没有使用 ID 或 Class 来识别输入。

有人可以帮我吗？谢谢

JS

$(document).ready(function () {
  $('.jimmy').click(function(e){
  e.preventDefault;
  jimsFunction(this);
  });
});

function jimsFunction(input) {
  let ele = $(input).parent().siblings(':first-child').children();
  ele.select();
  ele.setSelectionRange(0, 99999);
  navigator.clipboard.writeText(ele.value);
  alert("Copied: " + ele.value);
}

HTML

      <div class="colbody">
        <div>
          <input type="text" value="www.brave.com" readonly>
        </div>
        <div>
          <a href="www.google.com" target="_blank">View</a>                                
        </div>
        <div>
          <button type="button" class="jimmy">Copy URL</button>
        </div>
      </div>

Answer 1

setSelectionRange(0, 99999) 不是 jQuery 对象上的方法。在 DOM 元素上使用它。

所以尝试：[0]

示例：

$('.jimmy').click(function(e) {
  e.preventDefault;
  jimsFunction(this);
});


function jimsFunction(input) {
  let ele = $(input).parent().siblings(':first-child').children();
  ele[0].select();
  ele[0].setSelectionRange(0, 99999);
  navigator.clipboard.writeText(ele[0].value);
  alert("Copied: " + ele[0].value);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="colbody">
  <div>
    <input type="text" value="www.brave.com" readonly>
  </div>
  <div>
    <a href="www.google.com" target="_blank">View</a>
  </div>
  <div>
    <button type="button" class="jimmy">Copy URL</button>
  </div>
</div>

使用 Jquery 查找 Parent 兄弟姐妹第一个 Child 的第一个 Child

Find Parent Sibling First Child's First Child using Jquery

javascript

jquery

dom

copy

parent