11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Je travaille sur une zone de recherche. Les utilisateurs doivent pouvoir choisir entre trois parties du site a chercher. Je dois donc changer le lien de mon form (contenant la zone de recherche et le bouton valider) pour qu'il reflete bien le choix de l'utilisateur. Je connais ces liens, c'est le Javascript qui me manque Smiley ohwell

Au cours de mes recherches j'ai trouve comment changer des liens mais pour des images ou des "<a href>" , rien pour les form Smiley decu

Voici le code HTML :


<div id="round">
		<span id="1" style="font-size: 14px; color: red; margin-left: 35px; color: black;" onClick="choose1()"><b>Soek die webwerf</b></span>
		<span id="2" style="font-size: 14px; color: red; margin-left: 20px; color: #ca5242; text-decoration: underline;" onClick="choose2()"><b>Soek die wiki</form></b></span>
		<span id="3" style="font-size: 14px; color: red; margin-left: 20px; color: #ca5242; text-decoration: underline;" onClick="choose3()"><b>Soek alle geskiedenis webwerwe</form></b></span><br /><br />
<form action="/Special:Search" name="form1">
	<table style="margin-bottom: 10px;"><tr>
	<td>
	<span class="Apple-style-span" style="margin-left: 5px; border-collapse: separate; font-family: 'Times New Roman'; font-size: 16px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; vertical-align: center;">
		<span class="Apple-style-span" style="color: #e4e4e4; font-family: Verdana; font-size: 12px; line-height: 18px; text-align: left;">
			<span style="background-image: url(http://z.about.com/h/hp/srch_bg.gif); margin-left: 10px; padding: 0px 13px 5px 8px; font-size: 12px; font-style: inherit; font-weight: inherit; text-decoration: inherit; background-repeat: no-repeat; display: block; float: left; background-position: 0% 100%;">
				<div id="pointe" style="margin-left: 17%; margin-bottom: -6px;" ><img src="http://dekien.wikiunit.co.za/@api/deki/files/35/=pointe.gif?size=webview" alt="pointe"></div>
				<input name="search" type="text" style="border: transparent; margin: 0px; padding: 0px 0px 0px 0px; vertical-align: middle; width: 320px; font-family: Verdana; font-style: normal; font-variant: normal; font-weight: normal; font-size: 13px; line-height: 1.2; font-size-adjust: none; font-stretch: normal; height: 25px;" >
				<input type="submit"  value="FIND" style="background: none; color: #ffffff; text-transform: uppercase; margin-left: 5px; padding: 0px; cursor: pointer; vertical-align: middle; background-color: #c31b01; height: 25px; text-align: center; width: 60px; margin-bottom: 3px; background-position: 50%;" /></td>
			</span>
		</span>
		<td>
		<span style="border-collapse: separate; color: rgb(0, 0, 0); font-family: 'Times New Roman'; font-size: 16px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;">
			<span style="color: rgb(51, 51, 51); font-family: Verdana; font-size: 12px; line-height: 18px; text-align: center;"></span>
				<label name="searchtext" type="text" style="font-size: 10px; font-family: 'Verdana'; margin-left: 5px; color: #999999;">> Soek die geskiedenis webwerf deur 'n soekterm in te voer</label>
			</span>
		</span>
		</td></tr></table>
	</span>
</form>
</div>


Merci d'avance Smiley ohwell
Modifié par Aemilia (28 Jul 2009 - 11:32)
Arf j'ai trouve un lien pour ca finalement lol Sur ce forum en plus ... Voici le lien : http://forum.alsacreations.com/topic-5-13538-1-resoluJavascript-formulaire-modifier-action.html

Je mets mon code de bourrin au passage, qui comprends plusieurs petites choses comme changer des couleurs, se faire balader une petite pointe et changer le texte d'un label ...

Merci a ceux qui ont jete un oeil et qui ont peut-etre commence a chercher ^^


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">

<style type="text/css" media="screen">

div#Picture {
	width:800px;
	height:52px;
	font-size: 80px;
	text-align: center;
	background-color: #FF0000;
	margin-left: auto;
	margin-right: auto;
}
div#Picture2 {
	width:550px;
	height:52px;
	font-size: 80px;
	background-color: #000000;
	float:left;
	
}

.round {
	padding: 5px 10px;
	background-color: #f5f5f5;
	
}

div#menu {
	height:30px;
	font-size: 14px;
	text-align: center;
	background-color: #df250c;
	text-weight: bold;
	width:100%;
}

div#items {
	font-size:11px;
	background-color: black;
	color: #f08b14;
	height: 22px;
	margin-left: 5px;
	position:relative;
	float:left;
	padding-top:3px;
	margin-top:5px;
	padding-left:4px;
	padding-right:4px;
}

</style>
</head>
<body>

<script type="text/javascript">
<!--
	
	var link;

	function choose1(){
	document.getElementById("1").style.color="black";
	document.getElementById("2").style.color="#ca5242";
	document.getElementById("3").style.color="#ca5242";
	document.getElementById("1").style.textDecoration = "none";
	document.getElementById("2").style.textDecoration = "underline";
	document.getElementById("3").style.textDecoration = "underline";
	document.getElementById("pointe").style.marginLeft = "17%";
	link="http://dekien.wikiunit.co.za/Special:Search?search=smith&type=fulltext&go=Find";
	document.getElementById('searchtext').innerHTML = '> Soek deur die boek: Nuwe Geskiedenis van SA boek' ;

	}
	function choose2(){
	document.getElementById("1").style.color="#ca5242";
	document.getElementById("2").style.color="black";
	document.getElementById("3").style.color="#ca5242";
	document.getElementById("1").style.textDecoration = "underline";
	document.getElementById("2").style.textDecoration = "none";
	document.getElementById("3").style.textDecoration = "underline";
	document.getElementById("pointe").style.marginLeft = "47%";
	link="http://www.google.com/webelements/customsearch/?cx=001017936954614830495:yngday-ozos";
	document.getElementById('searchtext').innerHTML = '> Soek deur die wiki: Nuwe Geskiedenis van SA wiki' ;

	}
	function choose3(){
	document.getElementById("1").style.color="#ca5242";
	document.getElementById("2").style.color="#ca5242";
	document.getElementById("3").style.color="black";
	document.getElementById("1").style.textDecoration = "underline";
	document.getElementById("2").style.textDecoration = "underline";
	document.getElementById("3").style.textDecoration = "none";
	document.getElementById("pointe").style.marginLeft = "73%";
	link="/Special:Search";
	document.getElementById('searchtext').innerHTML = '> Soek verwante geskiedenis webwerwe' ;
	}
	
	function destination(){
	document.forms['form1'].action = link;
	}
//-->
</script>


<!--Pictures on the top-->
<div id="Picture" >
<div id="Picture2" ><img src="/@api/deki/files/34/=logo_afr.gif?size=webview" style="margin-top: 16px; width:550px;"></div>
<img src="/@api/deki/files/29/=img_block1.gif?size=webview" align="left" style="width:50px;"/><img src="http://dekien.wikiunit.co.za/@api/deki/files/30/=img_block2.gif?size=webview" style="width:50px;" align="left"/><img src="http://dekien.wikiunit.co.za/@api/deki/files/31/=img_block3.gif?size=webview" style="width:50px;" align="left"/><img src="http://dekien.wikiunit.co.za/@api/deki/files/32/=img_block4.gif?size=webview	" style="width:50px;" align="left"/><img src="http://dekien.wikiunit.co.za/@api/deki/files/33/=img_block5.gif?size=webview" style="width:50px;" align="left"/>
</div>

<div id="round">
		<span id="1" style="font-size: 14px; color: red; margin-left: 35px; color: black;" onClick="choose1()"><b>Soek die webwerf</b></span>
		<span id="2" style="font-size: 14px; color: red; margin-left: 20px; color: #ca5242; text-decoration: underline;" onClick="choose2()"><b>Soek die wiki</form></b></span>
		<span id="3" style="font-size: 14px; color: red; margin-left: 20px; color: #ca5242; text-decoration: underline;" onClick="choose3()"><b>Soek alle geskiedenis webwerwe</form></b></span><br /><br />
<form action="/Special:Search" name="form1">
	<table style="margin-bottom: 10px;"><tr>
	<td>
	<span class="Apple-style-span" style="margin-left: 5px; border-collapse: separate; font-family: 'Times New Roman'; font-size: 16px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; vertical-align: center;">
		<span class="Apple-style-span" style="color: #e4e4e4; font-family: Verdana; font-size: 12px; line-height: 18px; text-align: left;">
			<span style="background-image: url(http://z.about.com/h/hp/srch_bg.gif); margin-left: 10px; padding: 0px 13px 5px 8px; font-size: 12px; font-style: inherit; font-weight: inherit; text-decoration: inherit; background-repeat: no-repeat; display: block; float: left; background-position: 0% 100%;">
				<div id="pointe" style="margin-left: 17%; margin-bottom: -6px;" ><img src="http://dekien.wikiunit.co.za/@api/deki/files/35/=pointe.gif?size=webview" alt="pointe"></div>
				<input name="search" type="text" style="border: transparent; margin: 0px; padding: 0px 0px 0px 0px; vertical-align: middle; width: 320px; font-family: Verdana; font-style: normal; font-variant: normal; font-weight: normal; font-size: 13px; line-height: 1.2; font-size-adjust: none; font-stretch: normal; height: 25px;" >
				<input type="submit"  value="FIND" style="background: none; color: #ffffff; text-transform: uppercase; margin-left: 5px; padding: 0px; cursor: pointer; vertical-align: middle; background-color: #c31b01; height: 25px; text-align: center; width: 60px; margin-bottom: 3px; background-position: 50%;" onClick="destination()"/></td>
			</span>
		</span>
		<td>
		<span style="border-collapse: separate; color: rgb(0, 0, 0); font-family: 'Times New Roman'; font-size: 16px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;">
			<span style="color: rgb(51, 51, 51); font-family: Verdana; font-size: 12px; line-height: 18px; text-align: center;"></span>
				<label id="searchtext" type="text" style="font-size: 10px; font-family: 'Verdana'; margin-left: 5px; color: #999999;">> Soek die geskiedenis webwerf deur 'n soekterm in te voer</label>
			</span>
		</span>
		</td></tr></table>
	</span>
</form>
</div>
<div id="menu">
	<div id="items" style="padding-left:4px;padding-right:4px;background-color: white;color: black;height: 80%;margin-left: 3%;font-weight: bold;padding-top: 5px;">Home</div>
	<div id="items" ><a href="/Afrikaans/Deel_1"><font color="rgb(214, 143, 58)"> < 1838 Pre-kolonisasie</font></a></div>
	<div id="items" ><a href="/Afrikaans/Deel_2"><font color="rgb(214, 143, 58)">1800-1899 Ontwrigtings tot nasionalisme</font></a></div>
	<div id="items" ><a href="/Afrikaans/Deel_3"><font color="rgb(214, 143, 58)">1850-1945 Landelik tot nywerheids</font></a></div>
	<div id="items" ><a href="/Afrikaans/Deel_4"><font color="rgb(214, 143, 58)"> > 1945 Afrikanerstaat tot Afrikastaat</font></a></div>
</div>
</body></html>