Sådan oprettes en Beregninger webside

webside regnemaskiner er en sjov måde at give dine besøgende et praktisk værktøj til at gøre lidt hurtig matematik uden at trække deres dias herskere.Regnemaskiner tilføje en smule sjov og pizzazz til din hjemmeside.Hvis du er fremme et produkt eller en service, kan regnemaskiner hjælpe dig med at få dit budskab til dine kunder og generere gentage besøgende.JavaScript kan du oprette beregninger direkte på din webside, ved hjælp af tal dine besøgende skriver i en HTML-formular.Denne enkle lommeregner er udgangspunktet for at designe dit eget tilpassede webside lommeregner.

hvad du har brug

  • Tekst eller HTML-editor
  • webside

Instruktioner

  1. åbne websiden, hvor du gerne vil have din lommeregner.

  2. Kopier følgende script i header sektionen på siden (mellem & lt; head & gt; og & lt; / head & gt; mærker over & lt; body & gt; tag).

    & amp; lt; script type = \ & amp; quot; tekst / javascript \ & amp; quot;language = \ & amp; quot; Javascript \ & amp; quot; & gt;

    var v1 = 0

    GO

    var v2 = 0

    GO

    var svar = 0

    GO

    funktion beregne () {
    // Det Beregning: skift operatør i denne ligning til at ændre beregningen
    svaret = v1 + v2

    GO

    Var elem

    GO

    elem = document.getElementById (\ & amp; quot; v1 \ & amp; quot;)

    GO

    elem.value = v1

    GO

    elem = document.getElementById (\ & amp; quot; v2 \ & amp; quot;)

    GO

    elem.value = v2

    GO

    elem = document.getElementById (\ & amp; quot; svar \ & amp; quot;)

    GO

    elem.value = besvare

    GO

    }

    funktion setValue (elem) {
    var val = 0,0

    GO

    hvis (elem.value = \ & amp;! quot; \ & amp; quot;) {
    val = parseFloat (elem.value)

    GO

    }
    else {
    val = 0,0

    GO

    }
    kontakt (elem.id) {
    tilfælde \ & amp; quot; v1 \ & amp; quot ;: v1 = val;bryde

    GO

    sagen \ & amp; quot; v2 \ & amp; quot ;: v2 = val;bryde

    GO

    }
    beregne ()

    GO

    }
    & amp; lt; / script & gt;
  3. Tilføj attributten onload = \ "beregne (); \" til & lt; body & gt;tag, så det ser ud: & lt; krop onload = \ "beregne (); \" & gt ;.Hvis der er andre egenskaber i kroppen tag, skal du ikke slette dem, skal du blot tilføje den nye onload attribut.

  4. I kroppen på din webside, skal du tilføje følgende HTML-formular, hvor du gerne vil have lommeregneren vises:

    & lt; formen & gt;

    & amp; lt; input type = \ & amp; quot; tekst \ & amp; quot;id = \ & amp; quot; v1 \ & amp; quot;onKeyUp = \ & amp; quot; javascript: setValue (dette); \ & amp; quot; & gt;+
    & amp; lt; input type = \ & amp; quot; tekst \ & amp; quot;id = \ & amp; quot; v2 \ & amp; quot;onKeyUp = \ & amp; quot; javascript: setValue (dette); \ & amp; quot; & gt;=
    & amp; lt; input type = \ & amp; quot; tekst \ & amp; quot;id = \ & amp; quot; svar \ & amp; quot;readonly & gt;

    & lt; / form, & gt;

  5. Change beregningen ved at ændre linjen "svar = v1 + v2" i JavaScript-sektionen.For eksempel, hvis du ønsker at formere i stedet for add, ændre på plustegnet til en stjerne (*) ud:

    svar = v1 * v2

    Opdater HTML formular til at vise den nye beregning.

Tips & amp;Advarsler

  • Tilføj tekst, stil og farve til formen beregningen.Læg input-tags, som du vil have dem til at blive vist.Føj beskrivelser til indtastningsfelterne.Sæt en rød kontur omkring svaret.Vær kreativ.
  • Eksperimenter med JavaScript og HTML formular.Har du brug for at udføre en beregning på mere end to tal?For hver linje kode, der har en "v2" (undtagen Beregning linje) kopiere koden til en ny linje og forandring "V2" til "v3". Tilføj den nye "v3" værdi til beregningen i Javascript, som denne: "answer = v1 + v2 + v3."

Resources

  • JavaScript aritmetiske operatorer: Grundlæggende matematik Operations
  • JavaScript Core Math Objekt: Avanceret Math Operations
677
0
0
Java Script