Así que tengo este programa donde actualizo un archivo .txt y me muestra el contenido del mismo. Pero ahora quiero que me muestre solo cuando hago clic en el botón. Pero no está funcionando.
<div id="output"></div> <button id="btn">Click me</button> <script type="text/javascript"> document.getElementById("btn").addEventListener("click", function () { const input = document.getElementById("inputfile"); if (!input.files.length) { alert("No file selected!"); return; } const fr = new FileReader(); fr.onload = function () { if (!fr.result) { return; } const resultAsArray = fr.result.split('\r\n'); let index = 0; const displayInterval = setInterval(() => { if (index === (resultAsArray.length - 1)) { clearInterval(displayInterval); return; } let html$ = document.getElementById('output').innerHTML; html$ += '<div>' + resultAsArray[index] + '</div>'; document.getElementById('output').innerHTML = html$; index++; }, 1000); } fr.readAsText(this.files[0]); }); </script>Obtuve este código javascript de Internet
Intenta hacer esto:
Dondequiera que estés haciendo las cosas HTML:
<button id="button-id">Click Me</button>Luego, dentro de tu JavaScript:
let button = document.getElementById('button-id') button.addEventListener("click", theFunction); function theFunction() { //Code to be executed when the button is pressed.. }Dé una identificación al botón y luego use este código.
document.getElementById('buttonID') .addEventListener('click', function (){ //statements })Puede nombrar la función, luego cambiar para obtener archivos de la entrada, así que simplemente reemplace this.files[0] por el archivo que obtiene de la entrada.
<input type="file" name="inputfile" id="inputfile"> <br> <div id="output"></div> <button onclick="test()">Click me</button> <script type="text/javascript"> function test() { var inputElement = document.getElementById('inputfile'); var fileList = inputElement.files; var fr = new FileReader(); fr.onload = function () { if (!fr.result) { return; } const resultAsArray = fr.result.split('\r\n'); let index = 0; const displayInterval = setInterval(() => { if (index === (resultAsArray.length - 1)) { clearInterval(displayInterval); return; } let html$ = document.getElementById('output').innerHTML; html$ += '<div>' + resultAsArray[index] + '</div>'; document.getElementById('output').innerHTML = html$; index++; }, 1000); } fr.readAsText(fileList[0]); } </script>