Estoy tratando de hacer un explorador de archivos en un sitio web. Primero, estoy haciendo un XMLHttpRequest para obtener todos los archivos en el repertorio actual y agregarlo al HTML. El problema es cuando quiero poner un Event Listener en todos los nodos que obtuve en el HTML, no puede porque la solicitud XML siempre finaliza después del momento en que me gustaría poner el event Listener...
$(window).on("load", function() { //prépare ajax let ajax = new XMLHttpRequest(); let methode = "GET"; let url = "php/getFile.php" let asynchronous = true; ajax.open(methode, url, asynchronous); ajax.send(); let data; ajax.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { let data = JSON.parse(this.responseText); let files = ` <ul data-role="listview" data-view="list" data-select-node="true"> <ListView ScrollViewer.HorizontalScrollBarVisibility="Auto" ScrollViewer.HorizontalScrollMode="Enabled" >`; for (let i = 0; i < data.length; i++) { let file = data[i]; let nom = file['file']; let ext = "." + file['ext']; let nudeExt = file['ext']; files += `<li id="test" data-icon="<span class='mif-document-file-${nudeExt.toLowerCase()}'>" data-caption="${nom}"></li>` } files += ` </ul>`; document.querySelector("#files").innerHTML = files; // I try to put the event listener here but it doesn't work, document.querySelector("#test").addEventListener("onclick", test()); } } }) function test() { let test = document.querySelector('#test'); console.log(test) }RESPONDER
En el lugar de agregar un detector de eventos como este:
document.querySelector("#test").addEventListener("onclick", test());
He agregado directamente el evento en el nodo de esta manera:
files += ` <li ondblclick="test()" class="folder" type="folder" data-icon="<span class='mif-folder'>" data-caption="${nom}"></li>
RESPONDER
En el lugar de agregar un detector de eventos como este:
document.querySelector("#test").addEventListener("onclick", test());
He agregado directamente el evento en el nodo de esta manera:
files += ` <li ondblclick="test()" class="folder" type="folder" data-icon="<span class='mif-folder'>" data-caption="${nom}"></li>```