Kirjautuminen

Haku

Tehtävät

Keskustelu: Nettisivujen teko: Javascript ja formit

Macro [13.05.2010 09:56:54]

#

Minulla on funktio X, joka vaatii tiedot lomake ja elementti. Kirjoitan siis X('lomake', 'elementti'). Miten Javascriptillä saan muutettua tietyn formin tiettyä inputtia näillä tiedoilla?
document.{lomake}.{elementti}.value ei toiminut.


Muokkaus.

<html>
	<head>
		<title>Slide</title>

		<script type="text/javascript">
		var teksi = new Array("Testi......................................................", "Testi2......................................................", "Testi3..........................................");

		var speed = 1;
		var index = 0; text_pos = 0;
		var str_length = teksi[0].length;
		var contents, row;

		function slide(elementti, lomake) {
			contents = '';
			row = Math.max(0, index - 9);

			while(row < index)
				contents += teksi[row++] + "\r\n";

			document.forms[lomake].elements[elementti].value = contents + teksi[index].substring(0, text_pos) + "_";
			if(text_pos ++== str_length) {
				text_pos = 0;
				index++;

				if(index != teksi.length) {
					str_length = teksi[index].length;
					setTimeout(slide, 2000);
				}
			} else
				setTimeout(slide, speed);
		}
		</script>
	</head>
	<body onLoad="slide('lomake', 'slide')">
		<form name="lomake">
			<textarea id="slide" name="slide" rows="20" cols="80"></textarea>
		</form>
	</body>
</html>

tsuriga [13.05.2010 11:12:55]

#

document.getElementById

Merri [13.05.2010 13:59:39]

#

http://www.quirksmode.org/js/forms.html – eli pitäisi käyttää indeksinumeroita, ei elementtien nimiä.

getElementById:stä kannattaa muistaa, että IE6, IE7 ja IE8:n perinnemoodit palauttaa virheellisesti myös name-elementtejä. Ainut helppo keino kiertää ongelma elementtien namen ja id:n erottelun lisäksi olisi käyttää jotakin kirjastoa, jossa ongelma on huomioitu: jQuery, MooTools, Prototype ja näin edelleen.

Isoin ongelma sinulla tuossa on se, että kutsuessasi slideä setTimeoutin lävitse sinulta jää uupumaan parametrit. Tämän vuoksi sekä elementti että lomake ovat undefined ensimmäisen kerran kun setTimeout rävähtää ja sen takia saat virheilmoituksen, vaikka vaihtaisitkin onloadin kutsun muotoon slide(0, 0).

Eli käytännössä koodi pitäisi muotoilla uusiksi siten, että saat välitettyä arvot eteenpäin.


Muoks!
Rajoitetuilla perus-JavaScriptin taidoillani päädyin seuraavaan:

<!DOCTYPE html>
<html>
	<head>
		<title>Slide</title>

		<script type="text/javascript">

var teksi = new Array("Testi......................................................", "Testi2......................................................", "Testi3..........................................");

function slide(element, form) {
	var elementti = element;
	var lomake = form;
	var speed = 100;
	var index = 0; text_pos = 0;
	var str_length = teksi[index].length;
	var contents, row;

	animate();

	function animate() {
		contents = '';
		row = Math.max(0, index - 9);

		while(row < index)
			contents += teksi[row++] + "\r\n";

		document.forms[lomake].elements[elementti].value = contents + teksi[index].substring(0, text_pos) + "_";
		if(text_pos ++== str_length) {
			text_pos = 0;
			index++;

			if(index != teksi.length) {
				str_length = teksi[index].length;
				setTimeout(animate, 2000);
			}
		} else
			setTimeout(animate, speed);
	}
}

		</script>
	</head>
	<body onLoad="slide(0, 0)">
		<form id="lomake" name="lomake">
			<textarea id="slide" name="slide" rows="20" cols="80"></textarea>
		</form>
	</body>
</html>

Vastaus

Aihe on jo aika vanha, joten et voi enää vastata siihen.

Tietoa sivustosta