Lo que pasa es que estoy intentando hacer que en HTML un botón con texto (abrir ficha técnica) que lo tengo alojado en mi dominio, digamos "archivo.pdf" pueda ser abierto en otra pestaña del navegador, y pueda ser visualizado la pagina web y en otra el "archivo.pdf". Lo que pasa, es que en mi código que he estado desarrollando, funciona bien con el target="_blank" y window.open("archivo", '_blank') y demás, lo que busco es que solo se abra una sola vez en otra pestaña el archivo pdf que quiero en la version de celular porque siempre se abren mas de 10 pestañas con el mismo archivo en el celular si se implementa mal el javascript con el , el y el html,o en otros casos tambien parece que ya se arregló, pero a la hora de implementarlo por ejemplo en 5 botones, abre el mismo archivo que se vinculó con el 5to botón en todos los demás botones anteriores, ayuda por favor :( Esto es lo que tengo avanzado
<!--forma 1 -->
<script>
function abrirPDF() {
var url = '/recursos/nombre del archivo.pdf'; // Reemplaza 'ruta-al-archivo.pdf' con la ubicación de tu archivo PDF
var win = window.open(url, '_blank');
if (win) {
// La ventana se abrió correctamente
win.focus(); // Enfoca la nueva pestaña si ya existe
} else {
// Bloquea la apertura múltiple de ventanas emergentes
alert('Por favor, habilita las ventanas emergentes en tu navegador.');
}
}
</script>
<button onclick="abrirPDF()">Abrir PDF</button>
<!--forma 2 -->
<button class="abrirArchivo" data-archivo="/recursos/nombredelarchivo.pdf">Descargar Ficha Técnica </button>
<script>
// Función para abrir archivos en otra ventana usando atributos personalizados
document.querySelectorAll('.abrirArchivo').forEach(function(boton) {
boton.addEventListener('click', function() {
var archivo = this.getAttribute('data-archivo');
if (archivo) {
window.open(archivo, '_blank');
}
});
});
</script>