1
votes

Résoudre la promesse javascript sur l'événement DOM

J'ai cherché une réponse mais je n'ai pas trouvé de réponse pour mon problème (ou du moins je n'ai pas compris comment le faire fonctionner pour le mien.) J'ai donc cette fonction:

Test.prototype.testing = function(){
  return new Promise(function (resolve, reject){
    document.getElementById("element").innerHTML = 
      "<button onclick=\"\">Next</button>";
  });
};

javascript promise dom

3 commentaires

Vous n'utilisez pas innerHTML? De cette façon, vous pourrez peut-être obtenir le bouton pour appeler directement résoudre ?

une promesse d'événement?

Je suppose que tu peux. si vous créez ce bouton en utilisant document.createElement ("button") et attachez ensuite le gestionnaire de clic qui résout la promesse. ça devrait marcher.

3 Réponses :

0
votes

Vous pouvez le faire. En utilisant l'API CustomEvent pour l'environnement du navigateur.

<p id="element"> Next </p>

function myPromiseReturningFunction() {
  return new Promise(resolve => {
    window.addEventListener("myCustomEvent", (event) => {
       resolve(event.detail);
    }) 
  })
}

myPromiseReturningFunction().then(result => {
   alert(result)
})

document.getElementById("element").addEventListener("click", () => {
   window.dispatchEvent(new CustomEvent("myCustomEvent", {detail : "It works!"}))
})

0 commentaires

0
votes

Une meilleure façon serait d'avoir déjà le bouton dans le DOM, puis de le référencer. À ce stade, il suffit de définir le gestionnaire d'événements onclick sur la fonction de résolution. (Vous pouvez également utiliser addEventListener si vous le souhaitez)

<button id='resolver'>Click me!</button>

var elBtn = document.getElementById('resolver');
function Test(){ }

Test.prototype.testing = function(){
  return new Promise(function (resolve, reject){
    elBtn.onclick = resolve;
  });
};

var t = new Test();
t.testing().then(x=> {
  console.log('resolved!');
});

0 commentaires

1
votes

Quelque chose comme ça?

<div id="element"></div>

function Test() {}

Test.prototype.testing = function(){
  return new Promise(function (resolve, reject){
    const btn = document.createElement("button")
    btn.innerHTML = 'Next'
    btn.addEventListener('click', resolve);
    document.getElementById("element").appendChild(btn)
  });
};

(new Test()).testing()

0 commentaires