web-dev-qa-db-fra.com

javascript: comment afficher les erreurs de script dans une alerte contextuelle?

Je souhaite afficher les erreurs de script dans une alerte contextuelle au lieu de les afficher dans la console du navigateur.

window.onerror = function() {
  var message = /* get error messages and put them here */;
  alert(message);
  return true;
};
javascripterror-handling
29
powerboy

Oui, c'est la bonne façon.

Voir la référence ici:

http://www.javascriptkit.com/javatutors/error2.shtml

Et une explication sur la façon de voir plus de détails sur l’erreur ici:

http://www.javascriptkit.com/javatutors/error3.shtml

Leur exemple:

window.onerror = function(msg, url, linenumber) {
    alert('Error message: '+msg+'\nURL: '+url+'\nLine Number: '+linenumber);
    return true;
}

Si vous souhaitez afficher une liste des erreurs dans une seule fenêtre contextuelle, c'est plus compliqué.

Puisque les erreurs se produisent 1 par 1, vous devez procéder comme suit:

  • a window.onerror handler store les détails de l'erreur dans un tableau

  • Vérifiez ce tableau périodiquement - soit via une minuterie, soit à chaque appel du gestionnaire window.onerror, soit les deux.

    Lorsque la vérification est effectuée, traiter le tableau en entier, afficher le contenu comme souhaité et vider un tableau

47
DVK

Juste au cas où quelqu'un voudrait l'utiliser avec jQuery:

$(window).on("error", function(evt) {

    console.log("jQuery error event:", evt);
    var e = evt.originalEvent; // get the javascript event
    console.log("original event:", e);
    if (e.message) { 
        alert("Error:\n\t" + e.message + "\nLine:\n\t" + e.lineno + "\nFile:\n\t" + e.filename);
    } else {
        alert("Error:\n\t" + e.type + "\nElement:\n\t" + (e.srcElement || e.target));
    }
});
2
user1398498

Aide pour résoudre ce problème

  • Caractère si dépasse dans le nom 20 le message d'erreur devrait être affiché, n'utilisez pas max en HTML ici.

  • La date de naissance devrait être entre 1990 et 2010

  • Tout devrait être affiché dans le popup d'alerte

<script>
function validation(){
   
    var errorMsg = new Array();

    if(!document.getElementById("name").value){
        errorMsg.Push("Please Enter Full Name");
    }

    if(!document.getElementById("age").value){
        errorMsg.Push("Please Enter age");
    }

   if(!document.getElementById("designation").value){
        errorMsg.Push("Please Enter designation");
    }

    if(!document.getElementById("salary").value){
        errorMsg.Push("Please Enter salary");
    }

  

    if(!document.getElementById("dob").value){
        errorMsg.Push("Please Enter dob");
    }

    var messageHtml = "";

    errorMsg.forEach(function (message) {
        messageHtml += "<li>" + message + "</li>";
    }

    document.getElementById("error").innerHTML = messageHtml;
}
</script>
<style>
#empForm{

 position:absolute;
padding-left: 10px;
    top: 25%;
    left: 55%;
    width:18em;
    height:20em;
    margin-top: -9em; 
    margin-left: -15em; 
    border: 1px solid #ccc;
    background-color: #f3f3f3;
}
#salary{

    margin-left: 48px;
}
#date{
    margin-left: 6px;
padding-right: 26px;
}
#designation{
margin-left: 10px;
}
#age{
margin-left: 59px;
}
#name{
margin-left: 47px;
}
#submit{

}
</style>
<html>
<head>
<title>Employee Details</title>
<body>


<div id=empForm>
<h1>Registration Form</h1>

<form name="EmployeeData" action="return validation()">
<div><label>Name </label><input type="text" id="name" name="name"></div></br>

<div><label>Age </label><input type="number" id="age" name="age"></div></br>

<div><label>Designation </label><input type="text" id="designation" name="designation"></div></br>

<div><label>Salary </label><input type="number" id="salary" name="salary"></div></br>

<div><label>Date of Birth </label><input type="date" id="date" name="date"></div></br>

<div id="submit"><center><input type="submit" name="submit" ></center></div>
</div>
</body>
</html>

0
fitness suggest

Regardez L'événement onerror de l'objet window , plus précisément Obtenir des détails supplémentaires sur une erreur

0
Adriaan Stander

Découvrez ceci: http://www.javascriptkit.com/javatutors/error3.shtml . On dirait que la signature est function(message, url, linenumber).

0
Bialecki