calcolo in HTML/JS per blogger

**tamtam9010** · 25-06-2015, 13:45

Ciao a tutti! Come da titolo vi chiedo aiuto per inserire un codice in funzionante nel mio blog per il calcolo "interattivo" di alcuni dati.
Ovviamente il codice che vi posto non e funzionante, riuscite a darmi una mano? Vorrei che durante l'inserimento dei campi da 1 a 4 si aggiorni automaticamente il campo 5.

codice HTML:

<html>
 <head>
<script>

  function operazione(){
campo1=document.vasoesp.campo1
campo2=document.vasoesp.campo2
campo3=document.vasoesp.campo3
campo4=document.vasoesp.campo4
campo5=document.vasoesp.campo5

campo5.value=[campo1.value*campo2.value]/(1-[[1+campo3.value]/[1+campo4.value]]];
}

</script>
 </head>

 <body>
  <table name="vasoesp" id="vasoesp">
  <tbody>

<tr>
    <td>Descrizione</td>
    <td>Valore</td>
    <td>Unità di misura</td>
</tr>
   

<tr class="Descrizione">
    <td class="nome">Contenuto acqua</td>
    <td><input type="text" name="campo1" id="campo1 onkeyup="operazione()"></td>
    <td class="Valore">litri</td>
</tr>

<tr class="Descrizione">
    <td class="nome">Coefficiente di dilatazione</td>
    <td><input type="text" name="campo2" id="campo2" value="0,0421"></td>
    <td class="Valore">n/a</td>
</tr>

<tr class="Descrizione">
    <td class="nome">Pressione di precarica</td>
    <td><input type="text" name="campo3" id="campo3" onkeyup="operazione()"></td>
    <td class="Valore">bar</td>
</tr>

<tr class="Descrizione">
    <td class="nome">Pressione di taratura valvola di sicurezza</td>
    <td><input type="text" name="campo4" id="campo4" onkeyup="operazione()"></td>
    <td class="Valore">bar</td>

</tr>



<tr>
    <td>Totale</td>
    <td><input type="text" name="campo5" id="campo5" value"campo.value" readonly="true"></td>
    <td class="Valore">litri</td>
</tr>


  </tbody>
 </table>

 </body>
</html>

**partime** · 25-06-2015, 14:25

Prova ad utilizzare getElementById per recuperare i campi in questione e metti il punto e virgola al fondo di ogni istruzione JavaScript in questo modo:

codice:

var campo1 = document.getElementById("campo1");

Inoltre, mancano le virgolette chiuse nella definizione dell'id del campo di testo chiamato "campo1".

**Vincent.Zeno** · 25-06-2015, 14:32

indipendentemente da "blogger"...

dai un'occhiata qui:
http://forum.html.it/forum/showthrea...readid=2913612

non so se quella piattaforma ti consenta di editare il codice in head, in caso negativo inserisci lo script in body e vedi se funziona.

**tamtam9010** · 25-06-2015, 17:58

Devo dire che il codice che ho allegato e frutto si scopiazzamenti vari perche non sono in grado (per ora) di scrivere in html da zero... Ho provato a mettere per ogni riga come indicato da @partime ma nulla...adesso il codice che ho é cosi:

codice HTML:

<html>
 <head>
<script>

  function operazione(){
var campo1=document.getElementById ("campo1");
var campo2=document.getElementById ("campo2");
var campo3=document.getElementById ("campo3");
var campo4=document.getElementById ("campo4");
var campo5=document.getElementById ("campo5");

campo5.value=[campo1.value*campo2.value]/(1-[[1+campo3.value]/[1+campo4.value]]];
}

</script>
 </head>

 <body>
  <table name="vasoesp" id="vasoesp">
  <tbody>

<tr>
    <td>Descrizione</td>
    <td>Valore</td>
    <td>Unità di misura</td>
</tr>
   

<tr class="Descrizione">
    <td class="nome">Contenuto acqua</td>
    <td><input type="text" name="campo1" id="campo1 onkeyup="operazione()"></td>
    <td class="Valore">litri</td>
</tr>

<tr class="Descrizione">
    <td class="nome">Coefficiente di dilatazione</td>
    <td><input type="text" name="campo2" id="campo2" value="0,0421"></td>
    <td class="Valore">n/a</td>
</tr>

<tr class="Descrizione">
    <td class="nome">Pressione di precarica</td>
    <td><input type="text" name="campo3" id="campo3" onkeyup="operazione()"></td>
    <td class="Valore">bar</td>
</tr>

<tr class="Descrizione">
    <td class="nome">Pressione di taratura valvola di sicurezza</td>
    <td><input type="text" name="campo4" id="campo4" onkeyup="operazione()"></td>
    <td class="Valore">bar</td>

</tr>



<tr>
    <td>Totale</td>
    <td><input type="text" name="campo5" id="campo5" value"campo.value" readonly="true"></td>
    <td class="Valore">litri</td>
</tr>


  </tbody>
 </table>

 </body>
</html>

Se volete potete provarlo voi qua:
http://batabs.blogspot.com/p/prova.html

**tamtam9010** · 26-06-2015, 21:06

Un piccolo UP.
Come da consiglio ho guardato il post ed ora il risultato non funzionante è il seguente:

codice HTML:

<!DOCTYPE HTML><html>  <head>    <title>CalcoloVasoEsp</title>    <meta charset="utf-8">    <script type="text/javascript"><script>var c1,c2,c3,c4,c5;var v1,v2,v3,v4,v5;
function calcola(){        if (v1 != c1.value) v1 = valNum(c1);        if (v2 != c2.value) v2 = valNum(c2);        if (v3 != c3.value) v3 = valNum(c3);        if (v4 != c4.value) v4 = valNum(c4);
        c5.value=[v1*v2]/[1-[[1+v3]/[1+v4]]];}      function valNum(c){        return  +(c.value = c.value.replace(",",".").match(/\d*[.]?\d*/));

      // Al caricamento della pagina      window.onload = function(){                // I campi interessati al calcolo        c1 = document.form.campo1;        c2 = document.form.campo2;        c3 = document.form.campo3;        c4 = document.form.campo4;        c5 = document.form.campo5;                // Assegno un handler per richiamare la funzione calcola() automaticamente quando avviene una qualsiasi modifica dei valori nei campi          c1.onchange = c1.onkeyup = c1.onpaste = c1.oninput         = c2.onchange = c2.onkeyup = c2.onpaste = c2.oninput        = c3.onchange = c3.onkeyup = c3.onpaste = c3.oninput        = c4.onchange = c4.onkeyup = c4.onpaste = c4.oninput        = calcola;



</script> </head>
 <body>  <table name="vasoesp" id="vasoesp">
<tr>    <td>Descrizione</td>    <td>Valore</td>    <td>Unità di misura</td></tr>   
<tr class="Descrizione">    <td class="nome">Contenuto acqua</td>    <td><input type="text" name="campo1" value="">Campo 1<br></td>    <td class="Valore">litri</td></tr>
<tr class="Descrizione">    <td class="nome">Coefficiente di dilatazione</td>    <td><input type="text" name="campo2" value="">Campo 2<br></td>    <td class="Valore">n/a</td></tr>
<tr class="Descrizione">    <td class="nome">Pressione di precarica</td>    <td><input type="text" name="campo3" value="">Campo 3<br></td>    <td class="Valore">bar</td></tr>
<tr class="Descrizione">    <td class="nome">Pressione di taratura valvola di sicurezza</td>    <td><input type="text" name="campo4" value="">Campo 4<br></td>    <td class="Valore">bar</td>
</tr>


<tr>    <td>Totale</td>    <td><hr><input readonly type="text" name="campo5" value="">Campo 5<br></td><hr>    <td class="Valore">litri</td></tr>
 </table>
 </body></html>

**Vincent.Zeno** · 27-06-2015, 00:48

formatta a modo quel codice, altrimenti nessuno te lo guarda

**tamtam9010** · 27-06-2015, 08:20

Chiedo scusa, non mi ero accorto della formattazione del codice precedente. Eccolo formattato meglio!

codice HTML:

<!DOCTYPE HTML>
<html>
  <head>
    <title>CalcoloVasoEsp</title>
    <meta charset="utf-8">
    <script type="text/javascript">

var c1,c2,c3,c4,c5;
var v1,v2,v3,v4,v5;

function calcola(){
        if (v1 != c1.value) v1 = valNum(c1);
        if (v2 != c2.value) v2 = valNum(c2);
        if (v3 != c3.value) v3 = valNum(c3);
        if (v4 != c4.value) v4 = valNum(c4);

        c5.value=[v1*v2]/[1-[[1+v3]/[1+v4]]];
}
      // Formatta il value del campo come valore numerico e lo restituisce
      function valNum(c){
        return  +(c.value = c.value.replace(",",".").match(/\d*[.]?\d*/));
}

      // Al caricamento della pagina
      window.onload = function(){
        
        // I campi interessati al calcolo
        c1 = document.table.campo1;
        c2 = document.table.campo2;
        c3 = document.table.campo3;
        c4 = document.table.campo4;
        c5 = document.table.campo5;
        
        // Assegno un handler per richiamare la funzione calcola() automaticamente quando avviene una qualsiasi modifica dei valori nei campi
          c1.onchange = c1.onkeyup = c1.onpaste = c1.oninput 
        = c2.onchange = c2.onkeyup = c2.onpaste = c2.oninput
        = c3.onchange = c3.onkeyup = c3.onpaste = c3.oninput
        = c4.onchange = c4.onkeyup = c4.onpaste = c4.oninput
        = calcola;

        // Se serve, puoi eseguire il calcolo ad apertura pagina per aggiornare il risultato nel caso i campi siano popolati in qualche modo preventivamente
        calcola();
      }




</script>
 </head>

 <body>
  <table action="#" method="post" name="table">

<tr>
    <td>Descrizione</td>
    <td>Valore</td>
    <td>Unità di misura</td>
</tr>
   

<tr class="Descrizione">
    <td class="nome">Contenuto acqua</td>
    <td><input type="text" name="campo1" value="600"></td>
    <td class="Valore">litri</td>
</tr>

<tr class="Descrizione">"
    <td class="nome">Coefficiente di dilatazione</td>
    <td><input type="text" name="campo2" value="0,0421"></td>
    <td class="Valore">n/a</td>
</tr>

<tr class="Descrizione">
    <td class="nome">Pressione di precarica</td>
    <td><input type="text" name="campo3" value="1"></td>
    <td class="Valore">bar</td>
</tr>

<tr class="Descrizione">
    <td class="nome">Pressione di taratura valvola di sicurezza</td>
    <td><input type="text" name="campo4" value="3"></td>
    <td class="Valore">bar</td>

</tr>



<tr>
    <td>Totale</td>
    <td><input readonly type="text" name="campo5" value=""></td>
    <td class="Valore">litri</td>
</tr>

 </table>

 </body>
</html>

**tamtam9010** · 28-06-2015, 19:17

Piccolo up

**tamtam9010** · 09-07-2015, 16:24

Potete mettere risolto, fortunatamente sono riuscito a fare da solo.

**Vincent.Zeno** · 09-07-2015, 16:46

Originariamente inviata da tamtam9010

Potete mettere risolto, fortunatamente sono riuscito a fare da solo.

qui funziona che si postano le soluzioni trovate per poterle condividere. sai, è un forum di auto-aiuto

Discussione: calcolo in HTML/JS per blogger

Strumenti discussione

Ricerca discussione

Visualizza

calcolo in HTML/JS per blogger

Permessi di invio