javascript gestire evento onClick() ad alcuni bottoni diversi con lo stesso id

**Cracker1992** · 08-05-2011, 20:20

avrei due richieste:
1)ho bisogno di gestire lo stesso evento tramite uno script in javascript in alcuni bottoni creati tramite un form in html ma che gli ho dato lo stesso id che richiamano la stessa funzione dello script che a seconda del bottone esce un risultato differente dentro una casella di testo. si può fare? se si come si fa?
ecco il codice che fatto della pagina che riguarda una calcolatrice in javascript:

codice:

<html>

<head>

<style type="text/css" >

.label{

	font-weight:bold;

	

}

.body{

	font-family:Tahoma, Geneva, sans-serif;

	color:#000;

}

.bottoni{

	color:#F00;

	font-weight:bold;

}

.risultato{

	color:#00F;

	font-weight:bold;

}

</style>

<title>calcolatrice</title>

<script type="text/javascript" language="javascript">

function calcolare(){

try{

primo= parseFloat(document.calcolatrice.primo.value);

secondo= parseFloat(document.calcolatrice.secondo.value);

}catch(exeception ){

	alert("iserisci solo numeri!");

	primo="";

	secondo="";

}

if(primo=="" && secondo==""){

	alert("iserisci i valori richiesti!");

}else if(primo=="" || secondo==""){

	alert("iserisci i valori mancanti...");

}else{

	if( parseFloat(document.getElementById("bottone").value)==0){

	val = primo+seoondo;

risultato = document.calcolatrice.risultato.value=val;

}else if(parseFloat(document.getElementById("bottone").value)==1 ){

	valdue = primo-seoondo;

risultato = document.calcolatrice.risultato.value=valdue;

}else if(parseFloat(document.getElementById("bottone").value)==2){

	valtre = primo*seoondo;

risultato = document.calcolatrice.risultato.value=valtre;

}else if( parseFloat(document.getElementById("bottone").value)==3){

	valquattro = primo/seoondo;

risultato = document.calcolatrice.risultato.value=valquattro;

}else if(parseFloat(document.getElementById("bottone").value)==4 ){

	valcinque = Math.pow(primo,secondo);

risultato = document.calcolatrice.risultato.value=valcinque;

}else if(parseFloat(document.getElementById("bottone").value)==5){

	valsei = Math.pow(secondo,primo);

risultato = document.calcolatrice.risultato.value=valsei;

}else if( parseFloat(document.getElementById("bottone").value)==6){

	valsette = Math.pow(primo,(1/secondo));

risultato = document.calcolatrice.risultato.value=valsette;

}else{

	valotto =Math.pow(secondo,(1/primo));

risultato = document.calcolatrice.risultato.value=valotto;

}

}

}

</script>

</head>

<body class="body">

<form action="" name="calcolatrice">

<table>

<tr>

<td><label class="label">primo numero:</label></td>

<td><input id="primo" type="text" value=""></input></td>

</tr>

<tr>

<td><label class="label">secondo numero:</label></td>

<td><input id="secondo" type="text" value=""></input></td>

</tr>

<tr>

<td><input   id ="bottone"type="button" class="bottoni" value="somma"onClick=" calcolare()"  ></input></td>

<td><input   id ="bottone"type="button" class="bottoni" value="differenza" onClick=" calcolare()"></input></td>

<td><input   id ="bottone" type="button" class="bottoni" value="prodotto"onClick= "calcolare()"></input></td>

<td><input   id ="bottone" type="button" class="bottoni" value="quoziente"onClick=" calcolare()"></input></td>

<td><input   id ="bottone"type="button" class="bottoni" value="elevazioneA"onClick=" calcolare()"></input></td>

<td><input   id ="bottone"type="button" class="bottoni" value="elevazioneB"onClick=" calcolare()"></input></td>

<td><input   id ="bottone"type="button" class="bottoni" value="radA"onClick=" calcolare()"></input></td>

<td><input   id ="bottone"type="button" class="bottoni" value="radB"onClick=" calcolare()"></input></td>

</tr>

<tr>

<td><label class="risultato">risultato:</label></td>

<td><input id="risultato" type="text" value="" readonly="readonly" disabled="disable"></input></td>

</tr>

</table>

</form>

</body>

</html>

praticamente la calcolatrice è pronta con tanto di stili solo che manca l'if che serve per quello che voglio.
2)poi se è esiste un qualcosa in javascript per formattare il risultato finale. come il decimalformat del java. lo so che il java e javascrip sono due liguaggi diversi di comune c'è solo il nome o poche altre cose ma o citato il liguaggio per farmi capire cosa intedevo per formattare il risultato finale.

**br1** · 08-05-2011, 21:44

Non esiste che due elementi nella stessa pagina abbiano lo stesso id... se tu non rispetti le regole non puoi pretendere che poi le cose funzionino a tuo piacimento e comando.

Scusa lo sfogo

**Cracker1992** · 09-05-2011, 13:58

x il mod:

Non esiste che due elementi nella stessa pagina abbiano lo stesso id... se tu non rispetti le regole non puoi pretendere che poi le cose funzionino a tuo piacimento e comando. Scusa lo sfogo

1) allora devo usare un id diverso per bottone.
2) fai bene a sfogarti cosi ho capito una cosa per risolvere il problema.

x gli altri:

1)

facendo finta che abbia già modificato il codice come faccio ad usare un bottone piuttosto che un altro nella stessa funzione?

2)
i ho detto questo nel precedente messaggio:

2)poi se è esiste un qualcosa in javascript per formattare il risultato finale. come il decimalformat del java. lo so che il java e javascrip sono due liguaggi diversi di comune c'è solo il nome o poche altre cose ma o citato il liguaggio per farmi capire cosa intedevo per formattare il risultato finale.

come risolvo?

**Cracker1992** · 10-05-2011, 21:17

heila c'e nessuno. la discusione è apperta nessuno oltre al mod ha dei consigli per me.

**br1** · 10-05-2011, 21:51

codice:

<html>
<head>
<style type="text/css">
.label{
	font-weight:bold;
}
.body{
	font-family:Tahoma, Geneva, sans-serif;
	color:#000;
}
.bottoni{
	color:#F00;
	font-weight:bold;
}
.risultato{
	color:#00F;
	font-weight:bold;
}
</style>
<title>calcolatrice</title>
<script type="text/javascript">
function calcolare(x) {
	try	{
		xprimo = document.calcolatrice.primo.value;
		xsecondo= document.calcolatrice.secondo.value;
	} catch(exeception) {
		alert("iserisci solo numeri!");
		xprimo="";
		xsecondo="";
	}

	if(xprimo=="" && xsecondo==""){
		alert("iserisci i valori richiesti!");

	}else if(xprimo=="" || xsecondo==""){
		alert("iserisci i valori mancanti...");
	}else{
		xprimo = parseFloat(xprimo);
		xsecondo = parseFloat(xsecondo);
		val = 0;
		if( x==0){
			val = xprimo+xsecondo;
		}else if(x==1 ){
			val = xprimo-xsecondo;
		}else if(x==2){
			val = xprimo*xsecondo;
		}else if( x==3){
			val = xprimo/xsecondo;
		}else if(x==4 ){
			val = Math.pow(xprimo,xsecondo);
		}else if(x==5){
			val = Math.pow(xsecondo,xprimo);
		}else if( x==6){
			val = Math.pow(xprimo,(1/xsecondo));
		}else{
			val =Math.pow(xsecondo,(1/xprimo));
		}
		document.calcolatrice.risultato.value=val.toFixed(2);
	}
}

</script>
</head>
<body class="body">
<form action="" name="calcolatrice">
<table>
<tr>
	<td><label class="label">primo numero:</label></td>
	<td><input id="primo" type="text" value=""></input></td>
</tr>
<tr>
	<td><label class="label">secondo numero:</label></td>
	<td><input id="secondo" type="text" value=""></input></td>
</tr>
<tr>
	<td><input   type="button" class="bottoni" value="somma"onClick=" calcolare(0)"  ></input></td>
	<td><input   type="button" class="bottoni" value="differenza" onClick=" calcolare(1)"></input></td>
	<td><input   type="button" class="bottoni" value="prodotto"onClick= "calcolare(2)"></input></td>
	<td><input   type="button" class="bottoni" value="quoziente"onClick=" calcolare(3)"></input></td>
	<td><input   type="button" class="bottoni" value="elevazioneA"onClick=" calcolare(4)"></input></td>
	<td><input   type="button" class="bottoni" value="elevazioneB"onClick=" calcolare(5)"></input></td>
	<td><input   type="button" class="bottoni" value="radA"onClick=" calcolare(6)"></input></td>
	<td><input   type="button" class="bottoni" value="radB"onClick=" calcolare(7)"></input></td>
</tr>
<tr>
	<td><label class="risultato">risultato:</label></td>
	<td><input id="risultato" type="text" value="" readonly="readonly" disabled="disable"></input></td>
</tr>
</table>
</form>
</body>
</html>

Non lo spiego: quarda le differenze e ragionaci su

**Cracker1992** · 11-05-2011, 14:56

grazie mille mod e la risposta che cervavo ho letto il codice lo capito tutto sopratuttto cosi posso governare meglio il javascript. cosi dovrei aver risolto. spero che riguarda tutti i miei problemi esposti. ma se mancasse qualcosa lo posto.

più spiegato di cosi si muore.

Discussione: javascript gestire evento onClick() ad alcuni bottoni diversi con lo stesso id

Strumenti discussione

Ricerca discussione

Visualizza

javascript gestire evento onClick() ad alcuni bottoni diversi con lo stesso id

Permessi di invio