Javascript löschen ausgewählt

WBOY
Freigeben: 2023-05-06 12:49:08
Original
815 Leute haben es durchsucht

JavaScript ist eine häufig verwendete Programmiersprache für die Webentwicklung und das interaktive Design von Benutzeroberflächen. In der JavaScript-Programmierung gibt es viele gängige Vorgänge, z. B. das Anzeigen von Eingabeaufforderungsfeldern, das Ausführen von Schleifen, bedingte Anweisungen usw. Dieser Artikel konzentriert sich auf die Verwendung von JavaScript zum Löschen von Auswahlen.

Die Hauptanwendung der JavaScript-Löschung ist der Formularübermittlungsvorgang. Wenn der Benutzer ein Element auswählt und auf die Schaltfläche „Löschen“ klickt, muss das Element aus dem Formular gelöscht werden. Um diese Funktion zu implementieren, müssen Sie JavaScript verwenden, um Skripte für den Betrieb zu schreiben. Im Folgenden werden die Implementierungsmethoden und Vorsichtsmaßnahmen vorgestellt.

1. JavaScript-Löschmethode

Bevor Sie JavaScript zum Löschen der Auswahl verwenden, müssen Sie zunächst das ausgewählte Element abrufen. Das Element mit der angegebenen ID kann über die Methode getElementById des Dokumentobjekts abgerufen werden. Rufen Sie beispielsweise im folgenden HTML-Code das Element mit der ID „myList“ ab:

<ul id="myList">
  <li>选项1</li>
  <li>选项2</li>
  <li>选项3</li>
</ul>
Nach dem Login kopieren

Verwenden Sie den folgenden JavaScript-Code, um das Element „Option 2“ abzurufen:

var option = document.getElementById("myList").children[1];
Nach dem Login kopieren

Entfernen Sie als Nächstes das Element wie folgt aus der Liste Code:

option.remove();
Nach dem Login kopieren

2. Hinweise

Wenn Sie JavaScript zum Löschen einer Auswahl verwenden, müssen Sie außerdem auf Folgendes achten:

1. Bestätigen Sie, ob das Element vorhanden ist

Bevor Sie ein Element mit JavaScript löschen Bestätigen Sie, ob das ausgewählte Element vorhanden ist. Wenn das Element nicht existiert, wird eine Ausnahme ausgelöst. Um diese Situation zu vermeiden, können Sie den folgenden Code verwenden, um festzustellen, ob das Element vorhanden ist:

var option = document.getElementById("myList").children[1];

if (option) {
  option.remove();
}
Nach dem Login kopieren

2. Kompatibilität

Verschiedene Browser unterstützen möglicherweise unterschiedlich JavaScript und einige Browser sind möglicherweise nicht in der Lage, die Löschmethode korrekt auszuführen . Um mit verschiedenen Browsern kompatibel zu sein, wird die Verwendung des folgenden Codes empfohlen:

if (option.parentNode) {
  option.parentNode.removeChild(option);
}
Nach dem Login kopieren

Diese Methode kann in den meisten Browsern normal ausgeführt werden.

3. Vorgangsbestätigung

Vor dem Löschen eines Elements sollte der Benutzer auch gefragt werden, ob der Löschvorgang erforderlich ist. Um diese Bestätigung zu erreichen, können Sie den folgenden Code verwenden:

var confirmed = confirm("确定要删除吗?");

if (confirmed) {
  option.remove();
}
Nach dem Login kopieren

Dieser Code öffnet ein Eingabeaufforderungsfeld, in dem der Benutzer den Löschvorgang bestätigen kann. Wenn der Benutzer auf die Schaltfläche „OK“ klickt, wird der Löschvorgang ausgeführt.

3. Beispieldemonstration

Das Folgende ist eine Beispieldemonstration, die auf der oben genannten Methode basiert:





<ul id="myList">
  <li>选项1</li>
  <li>选项2</li>
  <li>选项3</li>
</ul>



<script>
function removeOption() {
  var option = document.getElementById(&quot;myList&quot;).children[1];
  var confirmed = confirm("确定要删除吗?");

  if (option && confirmed) {
    option.remove();
  }
}
</script>


Nach dem Login kopieren

Wenn der Benutzer in diesem Beispiel auf die Schaltfläche „Ausgewähltes Element löschen“ klickt, wird ein Bestätigungsfeld angezeigt. Wenn der Benutzer auf „OK“ klickt, wird das Element „Option 2“ entfernt.

4. Zusammenfassung

Dieser Artikel konzentriert sich auf die Verwendung von JavaScript zum Löschen ausgewählter Elemente. Beim Betrieb müssen Sie auf die Existenz, Kompatibilität und Betriebsbestätigung von Elementen achten. Das Löschen ausgewählter Elemente in JavaScript ist eine häufige Funktion bei Formularübermittlungsvorgängen. Die Beherrschung dieser Fähigkeit wird die Effizienz der Webentwicklung erheblich verbessern.

Das obige ist der detaillierte Inhalt vonJavascript löschen ausgewählt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!