El problema que tengo es apuntar al texto en la etiqueta de entrada en el HTML a continuación con el botón que está copiando ese texto (palabras). ¿Qué necesito cambiar al JS para que apunte a ese valor de entrada?
Quiero hacer esto sin usar ID, ya que planeo replicar esto muchas veces y no quiero configurar ID individuales para las etiquetas de entrada.
Si hay una manera de referirse al elemento secundario Class - 'columns-small-8', entonces, ¿tal vez eso funcione?
Gracias por adelantado
JS
<script> window.onload=function(){ let btns = document.getElementsByTagName("button") Array.from(btns).forEach(ele => { ele.addEventListener("click", function() { jimsFunction(this) }); }) function jimsFunction(input) { let x = input.previousElementSibling let ele = x.previousElementSibling ele.select() ele.setSelectionRange(0, 99999) navigator.clipboard.writeText(ele.value) alert("Copied: " + ele.value) }} </script>HTML
<div> <div class="row collapse"> <div class="columns small-8"> <input type="text" value="words" readonly> </div> <div class="columns small-2"> <a class="button full-width secondary" href="www.google.com" target="_blank">View</a> </div> <div class="columns small-2"> <button type="button" class="button full-width secondary">Copy URL</button> </div> </div> </div>Con su estructura html, puede llamar a los padres de la misma manera que:
window.onload=function(){ let btns = document.getElementsByTagName("button") Array.from(btns).forEach(ele => { ele.addEventListener("click", function() { jimsFunction(this) }); }) function jimsFunction(input) { let x = input.parentElement.parentElement let ele = x.firstElementChild.firstElementChild ele.select() ele.setSelectionRange(0, 99999) navigator.clipboard.writeText(ele.value) alert("Copied: " + ele.value) }} <div> <div class="row collapse"> <div class="columns small-8"> <input type="text" value="words" readonly> </div> <div class="columns small-2"> <a class="button full-width secondary" href="www.google.com" target="_blank">View</a> </div> <div class="columns small-2"> <button type="button" class="button full-width secondary">Copy URL</button> </div> </div> </div>