Addera tal automatiskt?

3 svar · 332 visningar · startad av wborg 5 dec. 2003

wborgMedlem sedan dec. 2003208 inlägg

5 dec. 2003 21:16#1

Hej,

jag undrar om det på något sätt går att lägga ihop
tal från ett antal fält i ett annat fält automatiskt?

Exempel:

Jag har fyra input fält där jag ska skriva olika summor
och ett fält där jag vill ha ett script som automatiskt
uppdaerar summan av dom summor jag fyller i i mina
fyra input fält 'on-the-fly' så att säga.

Har för mig att jag såg ett sådant script nånstans i detta
forum men jag hittar inget när jag söker :(

Vet någon vilket script jag menar (om det nu var på denna
sidan) så behövs bara en länk dit ;)

CheguelinMedlem sedan juli 2003351 inlägg

5 dec. 2003 22:19#2

<html>
  <head>
    <title>Add automatically</title>
    <script type="text/javascript">
        function addValues() {
            var sum = 0;
            for (var i = 0; i < arguments[0].elements.length; i++)
                if (!isNaN(arguments[0].elements[i].value))
                    sum += Number(arguments[0].elements[i].value);

            return sum;
        }
    </script>
  </head>
  <body>
    <form>
      <p>
        <input onchange="alert(addValues(this.form));" type="text" />
      </p>

      <p>
        <input onchange="alert(addValues(this.form));" type="text" />
      </p>

      <p>
        <input onchange="alert(addValues(this.form));" type="text" />
      </p>

      <p>
        <input onchange="alert(addValues(this.form));" type="text" />
      </p>
    </form>
  </body>
</html>

Behöver du hjälp med koden så säg bara till.

wborgMedlem sedan dec. 2003208 inlägg

6 dec. 2003 23:02#3

Ja tack,

hjälp är välkommet.

Jag har här nedan bifogat min kod som jag vill ska vara på
följande sätt:

Man skriver siffror i ruta 1 - 18
Man får fortlöpande uppdateringar i Summa: rutan
dvs att när jag skriver in en siffra i ruta 1 - 18 så
ska Summa: rutan uppdateras.

<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<center>
<form>
<table border="1" style="border-collapse: collapse" bordercolor="#000000" width="90">
  <tr>
    <td>1</td>
	<td>2</td>
	<td>3</td>
	<td>4</td>
	<td>5</td>
	<td>6</td>
	<td>7</td>
	<td>8</td>
	<td>9</td>
  </tr>
  <tr>
    <td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
  </tr>
  <tr>
    <td>10</td>
	<td>11</td>
	<td>12</td>
	<td>13</td>
	<td>14</td>
	<td>15</td>
	<td>16</td>
	<td>17</td>
	<td>18</td>
  </tr>
  <tr>
    <td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" size="5"></td>
  </tr>
  <tr>
    <td  colspan="9" align="right">Summa:&nbsp;<input type="text" size="10"></td>
  </tr>
</table>
</form>
</center>
</body>
</html>

dectgapMedlem sedan sep. 20021 542 inlägg

7 dec. 2003 01:52#4

Ett exempel:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function addera(theForm){
    var summan = 0;
    for(var i=0; i<18; i++){
      summan += (isNaN(parseFloat(theForm.elements[i].value))) ? 0 : parseFloat(theForm.elements[i].value);
    }
    theForm.summa.value = summan;
}
</script>
</head>

<body>
<center>
<form>
<table border="1" style="border-collapse: collapse" bordercolor="#000000" width="90">
  <tr>
    <td>1</td>
	<td>2</td>
	<td>3</td>
	<td>4</td>
	<td>5</td>
	<td>6</td>
	<td>7</td>
	<td>8</td>
	<td>9</td>
  </tr>
  <tr>
    <td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
  </tr>
  <tr>
    <td>10</td>
	<td>11</td>
	<td>12</td>
	<td>13</td>
	<td>14</td>
	<td>15</td>
	<td>16</td>
	<td>17</td>
	<td>18</td>
  </tr>
  <tr>
    <td align="center"><input type="text" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
	<td align="center"><input type="text" onblur="addera(this.form)" size="5"></td>
  </tr>
  <tr>
    <td colspan="9" align="right">Summa: <input type="text" size="10" name="summa"></td>
  </tr>
</table>
</form>
</center>
</body>
</html>