logo

JavaScript program pro získání vybrané hodnoty přepínače

JavaScriptový program pro získání vybrané hodnoty přepínače:

V tomto příspěvku se naučíme, jak získat vybrané přepínače hodnotu z několika přepínačů pomocí JavaScriptu. Vytvoříme jeden jednoduchý HTML soubor s dvěma přepínače. Jedno tlačítko bude pod tlačítky. Pokud uživatel klikne na tlačítko, zobrazí se, které tlačítko je vybráno s upozorněním .

Program HTML/JavaScript:

Níže je kompletní program:Vytvořte jeden index.html soubor a zkopírujte a vložte níže uvedený kód. Chcete-li zobrazit změny, otevřete soubor v libovolném webovém prohlížeči.

<!DOCTYPE html>
<html lang="en">
	<head>
		<title>Radio Button Example</title>
		<script type="text/javascript">
			function buttonClickListener(){
				if(document.getElementById('radioFirst').checked){
					alert("You have selected the first radio button.");
        }
				else if(document.getElementById('radioSecond').checked){
					alert("You have selected the second radio button.");
        }
        else{
          alert("Please select atleast one radio button.")
        }
			}
		</script>
	</head>
<body style="text-align: center;">
	<h1>Select a radio button and click on 'Find Selected'</h1>
	<input type="radio" name='radioexample' id="radioFirst" value="First">First</input>
	<input type="radio" name='radioexample' id="radioSecond" value="Second">Second</input>
	<br><br>
	<input type="button" value="Find Selected" onClick="buttonClickListener()"/>
</body>

</html>

Tady,

  • Toto je pro HTML soubor. Zahrnuje také javascript kód. Kód uvnitř scriptu tagy je JavaScript
  • Přidali jsme dvě rádio tlačítka v těle . Můžete vybrat pouze jedno z těchto tlačítek protože oba mají stejné jméno . Pod těmito přepínači je přidáno jedno tlačítko. Po kliknutí na toto tlačítko buttonClickListener zavolá se metoda.
  • buttonClickListener metoda je definována v JavaScriptu kód. Kontroluje, který přepínač je zaškrtnutý a zobrazí jedno upozornění zpráva.

Bude to vypadat následovně:

Můžete kliknout na kterékoli z těchto přepínačů a kliknutím na tlačítko zobrazíte upozornění .

Mohlo by se vám také líbit:

  • JavaScriptový program pro nalezení lcm dvou čísel
  • Různé metody související s indexem v poli JavaScript
  • Jak změnit barvu textu v JavaScriptu po kliknutí na tlačítko
  • JavaScriptový program pro zjištění objemu koule
  • Jak obrátit číslo v JavaScriptu
  • JavaScriptový program pro kontrolu, zda je číslo mocninou jiného čísla