Wie ändere ich die Standardnachricht des erforderlichen Feldes im Popover der Formularsteuerung in Bootstrap?

 <form class="form-asd" role="form">
    <h2 class="form-signin-heading">login</h2><hr />
    <label class="control-label"  for="username">Username</label>
    <input class="form-control" type="email"  required="" placeholder="username"data-error="enter valid username"></input>
    <label class="control-label"  for="username">password</label>
    <input class="form-control" type="password"  required=" " placeholder="Password"></input>
    <label class="checkbox"></label>
    <button class="btn btn-lg btn-primary " type="submit">submit</button>
</form>

Wie können wir diese Standard-Popover-Meldung des Anforderungsfelds "Bitte füllen Sie dieses Feld aus" in "Bitte geben Sie den Benutzernamen ein" ändern?

Sie können die setCustomValidityFunktion verwenden, wenn ein oninvalidEreignis auftritt.

Wie unten:-

<input class="form-control" type="email" required="" 
    placeholder="username" oninvalid="this.setCustomValidity('Please Enter valid email')">
</input>

Aktualisieren:-

Um die Nachricht zu löschen, sobald Sie mit der Eingabe beginnen, verwenden Sie das oninput="setCustomValidity('')Attribut, um die Nachricht zu löschen.

<input class="form-control" type="email"  required="" placeholder="username"
 oninvalid="this.setCustomValidity('Please Enter valid email')"
 oninput="setCustomValidity('')"></input>

Die Kombination der Antworten von Mritunjay und Bartu ist die vollständige Antwort auf diese Frage. Ich kopiere das vollständige Beispiel.

<input class="form-control" type="email"  required="" placeholder="username"
 oninvalid="this.setCustomValidity('Please Enter valid email')"
 oninput="setCustomValidity('')"></input>

Hier,

this.setCustomValidity ('Bitte geben Sie eine gültige E-Mail-Adresse ein') " - Zeigt die benutzerdefinierte Nachricht an, wenn das Feld ungültig ist

oninput = "setCustomValidity ('')" - Entfernen Sie die ungültige Nachricht in der validierten Datei .

Und für alle Eingaben und wählen Sie:

$("input[required], select[required]").attr("oninvalid", "this.setCustomValidity('Required!')");
$("input[required], select[required]").attr("oninput", "setCustomValidity('')");

$ ("input [required]"). attr ("oninvalid", "this.setCustomValidity ('Say Somthing!')");

Dies funktioniert, wenn Sie mit der Maus zum vorherigen oder nächsten Feld wechseln, aber mit der Eingabetaste, dies funktioniert nicht !!!