Felhasználói eszközök

Eszközök a webhelyen


oktatas:web:javascript:javascript_urlap_elerese

< JavaScript

Űrlap elérése

  • Szerző: Sallai András
  • Copyright © Sallai András, 2011, 2013
  • Licenc: GNU Free Documentation License 1.3

Űrlap azonosítón keresztül

Szám: <input id="egy" type="text" size="2">
<input type="button" value="Dupla" onclick="
var szam1 = document.getElementById('egy').value;
document.getElementById('egy').value = szam1 * 2;
">

Szám:

Űrlap a form elemen keresztül

Duplázás:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
 
<script type="text/javascript" >
 
function dupla(urlap)
{
	var szam = urlap.elements["szam"].value;
	window.alert(szam * 2);
}
 
 
</script>
 
</head>
<body>
<form>
<input type="text" name="szam"/>
<input type="button" value="Mehet" 
onclick="dupla(this.form)"/>
</form>
 
</body>
</html>

Űrlap a form elemen keresztül újra

function csinal()
{
	alert(document.ez.bevitel.value);
}
<form name="ez">
<input type="text" name="bevitel" />
<input type="submit" onclick="csinal()"/>
</form>
var a = document.forms["teglalap"]["aoldal"].value;
 
var a = document.getElementById("aoldal").value;
document.getElementById("aoldal").value = eval(a) * 2;
function kerulet(){
    var a = document.teglalap.aoldal.value;
    var b = document.teglalap.boldal.value;
    document.teglalap.aoldal.value =  (eval(a) + eval(b)) * 2;
}
...
<form name="teglalap">
<fieldset>
<legend>Téglalap</legend>
a oldal: <input type="text" name="aoldal" id="ao"><br>
b oldal: <input type="text" name="boldal" id="bo"><br>
<input type="button" value="Kerület" onclick="kerulet()">
</fieldset>
</form>

Téglalapkerület

Kód:

index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Téglalap</title>
 
<script type="text/javascript" >
function kerulet() {
	var a = document.teglalap.aoldal.value;
	var b = document.teglalap.boldal.value;
	document.teglalap.aoldal.value =  (eval(a) + eval(b)) * 2;
	document.teglalap.boldal.value =  "";
	document.getElementById("acimke").innerHTML = "Kerület:";
	document.getElementById("bcimke").style.display = "none";
	document.getElementById("bo").style.display = "none";	
}
</script>
<style type="text/css">
form {
	width: 400px;
	display: inline-block;
}
#urlap {
	text-align: center;
}
legend, fieldset {
	border-style: solid;
	border-width: 1px;
	border-color: blue;
}
body {
	background-color: #90EE90;
}
</style>
</head>
<body>
 
<div id="urlap">
<form name="teglalap">
<fieldset>
<legend>Téglalap kerületszámítás</legend>
<label for="aoldal" id="acimke">a oldal:</label> <input type="text" name="aoldal" id="ao"><br>
<label for="boldal" id="bcimke">b oldal:</label> <input type="text" name="boldal" id="bo"><br>
<input type="button" value="Kerület" onclick="kerulet()">
</fieldset>
</form>
</div>
 
</body>
</html>

Minta:

Elérés azonosítokkal

Duplázó

<label for="szam">Szám: </label>
<input type="text" id="szam">
<button id="gomb">Számít</button>
<p id="eredmeny"></p>
document.getElementById("gomb").onclick = function(){
        var szam = document.getElementById("szam").value;
        var eredmeny = szam*2;
        document.getElementById("eredmeny").innerHTML = eredmeny;
};
oktatas/web/javascript/javascript_urlap_elerese.txt · Utolsó módosítás: 2019/08/22 19:46 szerkesztette: admin