onClick -> Scrivi testo

**Fred_88** · 01-09-2007, 21:41

ciao a tutti!
ho fatto qualche ricerca.. ma non ho trovato qualcosa di utile che mi possa aiutare... così confido in voi..

ho un form per l'upload con una riga per un file e vorrei che cliccando su un link comparisse un altra riga con altri campi...
spero di essermi spiegato..

grazie!
ciao

**$imone** · 01-09-2007, 22:48

MMM...cediamo se ho capito...
Si potrebbe fare così:

codice:

function ShowAndHide(id1,id2){
  if(document.getElementById){
    el1=document.getElementById(id1);
    el2=document.getElementById(id2);
    if(el1.style.display=="none"){
        el1.style.display="block";
        el2.style.display="none";
        }
    else{
        el1.style.display="none";
        el2.style.display="block";
        }
    }
}

Questa è la parte HTML relativa alla funzione javascript

codice:

<div id="mostra">
    Mostra commenti
</div>
<div id="commenti">
    Nascondi commenti
    

Commento</p>
</div>

e dovrai impostare nel CSS che commenti sia inizialmente invisibile

codice:

div#commenti{display:none;}

Questo script ti permette di fare una cosa del genere:
1) prima di tutto, ciò che vuoi che comapaia deve essere inserito in un div a parte (in questo caso il div è commenti) assieme ad un link che permetta di nacondere nuovamente il campo, e lo stesso vale per il link (in questo caso contenuto nel div mostra).
2)cliccando dul link, il div che inizialmente è nascosto tramite CSS comparirà, mostrando sia il contenuto che il link che chiede di nascondere nuovamente il campo.

Spero di aver dato la risposta a ciò che stavi cercando...

**joker06** · 01-09-2007, 22:51

e se invece che premere su un link volessi far partire lo script chekkando una check box?

**Fred_88** · 01-09-2007, 22:52

non proprio...
innanzitutto grazie per la risposta... poi
ti spiego

ho questo pezzo di codice:

codice:

Campo 1<input type="text" name="file_1">

e vorrei che cliccando su un link il campo sia riscritto di nuovo... quindi un click per ogni campo nuovo..

e che venga sostituito il numero 1 col numero del campo.. :P

**Fred_88** · 01-09-2007, 22:57

Originariamente inviato da joker06
e se invece che premere su un link volessi far partire lo script chekkando una check box?

quindi mettendo un controllo costante per vedere quando è selezionato?
mmm si va bene anche così..

**cavicchiandrea** · 01-09-2007, 23:12

leggi qui

**Fred_88** · 01-09-2007, 23:30

Originariamente inviato da cavicchiandrea
leggi qui

grazie..

ho provato ad adattarlo e funziona...
il problema è che ho una select con 30 campi... come posso mettercela fra i campi che vengono inseriti ad ogni click?
ciao grazie..

edit: risolto

**Fred_88** · 02-09-2007, 01:49

prendendo spunto e imparando dallo script che mi hai linkato ho scritto questo codice:

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
		<meta name="author" content="Fred">
		<title>Calcolo Tempi</title>
		<link rel="stylesheet" type="text/css" href="style.css">
		<script type="text/javascript">
//<!--
var num=2;
function aumenta(){
	if(document.createElement && document.getElementById && document.getElementsByTagName) {
		if (num<11){
					
		// creo tabella
		var Tab=document.createElement("TABLE");
			Tab.setAttribute("class","itable");
			Tab.setAttribute("cellpadding","2");
			Tab.setAttribute("cellspacing","1");
			Tab.setAttribute("width","300");
		
		// header
		var Tr_Titolo=document.createElement("TR");
		var Td_Titolo=document.createElement("TD");
		var Testo_Titolo=document.createTextNode("Attaccante #"+num);
			Td_Titolo.setAttribute("colspan","2");
			Td_Titolo.setAttribute("class","header1");
			Tab.appendChild(Tr_Titolo);
			Tr_Titolo.appendChild(Td_Titolo);		
			Td_Titolo.appendChild(Testo_Titolo);
		
		// i campi from_x_ e from_y_
		var Tr_Coo=document.createElement("TR");
		var Td_Coo=document.createElement("TD");
		var Txt_x=document.createTextNode("X ");
		var Campo_x=document.createElement("INPUT");
		var Txt_y=document.createTextNode("Y ");
		var Campo_y=document.createElement("INPUT");
			Td_Coo.setAttribute("colspan","2");
			// AttributiCampo_X
			Campo_x.setAttribute("type","text");
			Campo_x.setAttribute("size","3");
			Campo_x.setAttribute("name","from_x_"+num);
			Campo_x.setAttribute("value","0");
			Campo_x.setAttribute("maxlength","4");
			Campo_x.setAttribute("class","ibox");
			// Attributi Campo_Y
			Campo_y.setAttribute("type","text");
			Campo_y.setAttribute("size","3");
			Campo_y.setAttribute("name","from_y_"+num);
			Campo_y.setAttribute("value","0");
			Campo_y.setAttribute("maxlength","4");
			Campo_y.setAttribute("class","ibox");
			// concateniamo il tutto
			Tab.appendChild(Tr_Coo);
			Tr_Coo.appendChild(Td_Coo);
			Td_Coo.appendChild(Txt_x);
			Td_Coo.appendChild(Campo_x);
			Td_Coo.appendChild(Txt_y);
			Td_Coo.appendChild(Campo_y);
			
		// truppa lenta
		var Tr_Truppa=document.createElement("TR");
		var Td_Truppa1=document.createElement("TD");
		var Txt_Truppa1=document.createTextNode("Truppa pi&ugrave; lenta");
		var Td_Truppa2=document.createElement("TD");
		var Select_truppa=document.createElement("SELECT");
		var Optgroup_1=document.createElement("OPTGROUP");
		var Optgroup_2=document.createElement("OPTGROUP");
		var Optgroup_3=document.createElement("OPTGROUP");
			//Attributi
			Select_truppa.setAttribute("name","truppa_lenta_"+num);
			Optgroup_1.setAttribute("label","Teutoni");
			Optgroup_2.setAttribute("label","Galli");
			Optgroup_3.setAttribute("label","Romani");
			// concateniamo il tutto
			Tab.appendChild(Tr_Truppa);
			Tr_Truppa.appendChild(Td_Truppa1);
			Td_Truppa1.appendChild(Txt_Truppa1);
			Tr_Truppa.appendChild(Td_Truppa2);
			Td_Truppa2.appendChild(Select_truppa);
			Select_truppa.appendChild(Optgroup_1);
			Select_truppa.appendChild(Optgroup_2);
			Select_truppa.appendChild(Optgroup_3);
		
		//tutti gli options
		var Option_1=document.createElement("OPTION");
		var Option_2=document.createElement("OPTION");
		var Option_3=document.createElement("OPTION");
		var Option_4=document.createElement("OPTION");
		var Option_5=document.createElement("OPTION");
		var Option_6=document.createElement("OPTION");
		var Option_7=document.createElement("OPTION");
		var Option_8=document.createElement("OPTION");
		var Option_9=document.createElement("OPTION");
		var Option_10=document.createElement("OPTION");
		var Option_11=document.createElement("OPTION");
		var Option_12=document.createElement("OPTION");
		var Option_13=document.createElement("OPTION");
		var Option_14=document.createElement("OPTION");
		var Option_15=document.createElement("OPTION");
		var Option_16=document.createElement("OPTION");
		var Option_17=document.createElement("OPTION");
		var Option_18=document.createElement("OPTION");
		var Option_19=document.createElement("OPTION");
		var Option_20=document.createElement("OPTION");
		var Option_21=document.createElement("OPTION");
		var Option_22=document.createElement("OPTION");
		var Option_23=document.createElement("OPTION");
		var Option_24=document.createElement("OPTION");
		var Option_25=document.createElement("OPTION");
		var Option_26=document.createElement("OPTION");
		var Option_27=document.createElement("OPTION");
		var Option_28=document.createElement("OPTION");
		var Option_29=document.createElement("OPTION");
		var Option_30=document.createElement("OPTION");
		// i nomi delle truppe
		var Txt_Option_1=document.document.createTextNode("Combattente con mazza");
		var Txt_Option_2=document.document.createTextNode("Lanciere");
		var Txt_Option_3=document.document.createTextNode("Combattente con ascia");
		var Txt_Option_4=document.document.createTextNode("Esploratore");
		var Txt_Option_5=document.document.createTextNode("Paladino");
		var Txt_Option_6=document.document.createTextNode("Cavalleria teutonica");
		var Txt_Option_7=document.document.createTextNode("Ariete");
		var Txt_Option_8=document.document.createTextNode("Catapulta");
		var Txt_Option_9=document.document.createTextNode("Comandante");
		var Txt_Option_10=document.document.createTextNode("Decurione");
		var Txt_Option_11=document.document.createTextNode("Lanciere");
		var Txt_Option_12=document.document.createTextNode("Combattente con spada");
		var Txt_Option_13=document.document.createTextNode("Esploratore");
		var Txt_Option_14=document.document.createTextNode("Cavalleria gallica");
		var Txt_Option_15=document.document.createTextNode("Cavalleria da difesa");
		var Txt_Option_16=document.document.createTextNode("Cavalleria avanzata");
		var Txt_Option_17=document.document.createTextNode("Ariete");
		var Txt_Option_18=document.document.createTextNode("Catapulta");
		var Txt_Option_19=document.document.createTextNode("Capo trib&ugrave;");
		var Txt_Option_20=document.document.createTextNode("Decurione");
		var Txt_Option_21=document.document.createTextNode("Legionario");
		var Txt_Option_22=document.document.createTextNode("Pretoriano");
		var Txt_Option_23=document.document.createTextNode("Imperiano");
		var Txt_Option_24=document.document.createTextNode("Esploratore");
		var Txt_Option_25=document.document.createTextNode("Imperiano a cavallo");
		var Txt_Option_26=document.document.createTextNode("Cavalleria romana");
		var Txt_Option_27=document.document.createTextNode("Ariete");
		var Txt_Option_28=document.document.createTextNode("Catapulta");
		var Txt_Option_29=document.document.createTextNode("Senatore");
		var Txt_Option_30=document.document.createTextNode("Decurione");
		// i value degli options
		Option_1.setAttribute("value","7");
		Option_2.setAttribute("value","7");
		Option_3.setAttribute("value","6");
		Option_4.setAttribute("value","9");
		Option_5.setAttribute("value","10");
		Option_6.setAttribute("value","9");
		Option_7.setAttribute("value","4");
		Option_8.setAttribute("value","3");
		Option_9.setAttribute("value","4");
		Option_10.setAttribute("value","5");
		Option_11.setAttribute("value","7");
		Option_12.setAttribute("value","6");
		Option_13.setAttribute("value","17");
		Option_14.setAttribute("value","19");
		Option_15.setAttribute("value","16");
		Option_16.setAttribute("value","13");
		Option_17.setAttribute("value","4");
		Option_18.setAttribute("value","3");
		Option_19.setAttribute("value","5");
		Option_20.setAttribute("value","5");
		Option_21.setAttribute("value","6");
		Option_22.setAttribute("value","5");
		Option_23.setAttribute("value","7");
		Option_24.setAttribute("value","16");
		Option_25.setAttribute("value","14");
		Option_26.setAttribute("value","10");
		Option_27.setAttribute("value","4");
		Option_28.setAttribute("value","3");
		Option_29.setAttribute("value","4");
		Option_30.setAttribute("value","5");
		// concateno i nomi delle truppe con gli options
		Option_1.appendChild(Txt_Option_1);
		Option_2.appendChild(Txt_Option_2);
		Option_3.appendChild(Txt_Option_3);
		Option_4.appendChild(Txt_Option_4);
		Option_5.appendChild(Txt_Option_5);
		Option_6.appendChild(Txt_Option_6);
		Option_7.appendChild(Txt_Option_7);
		Option_8.appendChild(Txt_Option_8);
		Option_9.appendChild(Txt_Option_9);
		Option_10.appendChild(Txt_Option_10);
		Option_11.appendChild(Txt_Option_11);
		Option_12.appendChild(Txt_Option_12);
		Option_13.appendChild(Txt_Option_13);
		Option_14.appendChild(Txt_Option_14);
		Option_15.appendChild(Txt_Option_15);
		Option_16.appendChild(Txt_Option_16);
		Option_17.appendChild(Txt_Option_17);
		Option_18.appendChild(Txt_Option_18);
		Option_19.appendChild(Txt_Option_19);
		Option_20.appendChild(Txt_Option_20);
		Option_21.appendChild(Txt_Option_21);
		Option_22.appendChild(Txt_Option_22);
		Option_23.appendChild(Txt_Option_23);
		Option_24.appendChild(Txt_Option_24);
		Option_25.appendChild(Txt_Option_25);
		Option_26.appendChild(Txt_Option_26);
		Option_27.appendChild(Txt_Option_27);
		Option_28.appendChild(Txt_Option_28);
		Option_29.appendChild(Txt_Option_29);
		Option_30.appendChild(Txt_Option_30);
		// concateno option con optgroup
		Optgroup_1.appendChild(Option_1);
		Optgroup_1.appendChild(Option_2);
		Optgroup_1.appendChild(Option_3);
		Optgroup_1.appendChild(Option_4);
		Optgroup_1.appendChild(Option_5);
		Optgroup_1.appendChild(Option_6);
		Optgroup_1.appendChild(Option_7);
		Optgroup_1.appendChild(Option_8);
		Optgroup_1.appendChild(Option_9);
		Optgroup_1.appendChild(Option_10);
		Optgroup_2.appendChild(Option_10);
		Optgroup_2.appendChild(Option_11);
		Optgroup_2.appendChild(Option_12);
		Optgroup_2.appendChild(Option_13);
		Optgroup_2.appendChild(Option_14);
		Optgroup_2.appendChild(Option_15);
		Optgroup_2.appendChild(Option_16);
		Optgroup_2.appendChild(Option_17);
		Optgroup_2.appendChild(Option_18);
		Optgroup_2.appendChild(Option_19);
		Optgroup_2.appendChild(Option_20);
		Optgroup_3.appendChild(Option_20);
		Optgroup_3.appendChild(Option_21);
		Optgroup_3.appendChild(Option_22);
		Optgroup_3.appendChild(Option_23);
		Optgroup_3.appendChild(Option_24);
		Optgroup_3.appendChild(Option_25);
		Optgroup_3.appendChild(Option_26);
		Optgroup_3.appendChild(Option_27);
		Optgroup_3.appendChild(Option_28);
		Optgroup_3.appendChild(Option_29);
		Optgroup_3.appendChild(Option_30);
				
		document.getElementById("nuovi").innerHTML=Tab;
		// incrementa num
		num++
		}
	}
}

//-->
		</script>
	</head>
	<body>
		<div class="oben"></div>
		<div class="menu"></div>
		<div class="mitte2" align="center">
			<form method="post" action="">
				<table class="itable" cellpadding="2" cellspacing="1" width="300">
					<tr>
						<td colspan="2" class="header1">Dati Obiettivo</td>
					</tr>
					<tr>
						<td colspan="2">
							X <input value="0" name="to_x" type="text" maxlength="4" class="ibox" size="3">
							Y <input value="0" name="to_y" type="text" maxlength="4" class="ibox" size="3">
						</td>
					</tr>
					<tr>
						<td>Orario d'arrivo</td>
						<td>
							<input type="text" name="time_h" class="ibox" maxlength="2" size="3" value="00">
							:
							<input type="text" name="time_m" class="ibox" maxlength="2" size="3" value="00">
							:
							<input type="text" name="time_s" class="ibox" maxlength="2" size="3" value="00">
						</td>
					</tr>
				</table>
			<div id="nuovi">
			</div>
				Altro villaggio attaccante
				<div>
					<button type="submit">Calcola</button>
				</div>
			</form>
		</div>
	</body>
</html>

mi sapreste dire dov'è 'errore?
grazie
Fred

**Fred_88** · 03-09-2007, 02:25

up

**Xinod** · 03-09-2007, 02:35

al posto di quei document.document ci va solo document
al posto di
document.getElementById("nuovi").innerHTML=Tab;

document.getElementById("nuovi").appendChild(Tab);

ciao

Discussione: onClick -> Scrivi testo

Strumenti discussione

Ricerca discussione

Visualizza

onClick -> Scrivi testo

Permessi di invio