• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Kalkulator w JavaScript za pomocą formularza.

VPS Starter Arubacloud
+2 głosów
2,029 wizyt
pytanie zadane 14 grudnia 2021 w JavaScript przez grzybownik420 Nowicjusz (170 p.)

Jak zrobić kalkulator w JavaScript i html aby wybór działania (np. mnożenie dodawanie) można było wybrać przez liste rozwijajaca sie w formularzu. Na dole to jak probowalem zrobic

<html>

    <head>

        <link rel="stylesheet" href="style22.css">

        <meta charset="utf-8">

    </head>

    <body>

        <div class="div1">

            <h1>Kalkulator</h1>

            <input type="number" id="pole1" placeholder="wybierz 1 liczbe">

                <select name="lista_wynikow">

                    <option id="suma"> + </option>

                    <option id="roznica"> - </option>

                    <option id="mnozenie"> * </option>

                    <option id="iloraz"> / </option>

                </select>

                <input type="submit" value="oblicz" id="submits" onclick="oblicz()">

            <input type="number" id="pole2" placeholder="wybierz 2 liczbe">

            <br/><br/>

           

           

            <script type="text/javascript">

                function suma()

                {

                    var a=parseInt(document.getElementById("pole1").value);

                    var b=parseInt(document.getElementById("pole2").value);

                    var results1=a+b;

                    document.getElementById("show_results").innerHTML=results1;

                }

            </script>

            <div id="wyniki">

            <div id="show_results"> </div>

 

komentarz 14 grudnia 2021 przez TOWaD Mądrala (6,000 p.)

może coś z tego się przyda

<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div>
        <input id="num1" type="number" value="2">
        <input id="num2" type="number" value="5">
    </div>
    <div>
        <input id="wynik" type="number" disabled >
    </div>
    <div>
        <select name="aa" id="opcja">
            <option value="+">+</option>
            <option value="-">-</option>
            <option value="*">*</option>
            <option value="/">/</option>
        </select>
    </div>
    <div>
        <button>oblicz</button>
    </div>
    <script>
        document.getElementsByTagName('button')[0].addEventListener('click',()=>oblicz('num1','num2','wynik','aa'))
        ////////////////////////////////////
        function suma(a, b) { return a + b };
        function roznica(a, b) { return a - b };
        function iloczyn(a, b) { return a * b };
        function iloraz(a, b) { return b != 0 ? a / b : NaN };
        function cases(idSelect, a, b) {
            let opcja=document.getElementById("opcja").value;
            let wynik = 0;
            switch (opcja) {
                case '+': wynik = suma(a, b); break;
                case '-': wynik = roznica(a, b); break;
                case '*': wynik = iloczyn(a, b); break;
                case '/': wynik = iloraz(a, b); break;
                default: wynik=NaN;
            }
            return wynik;
        }
        function oblicz(idInputnum1,idInputnum2,idInputresult,idselectopt){
            let num1 = parseFloat(document.getElementById(idInputnum1).value); //parseFloat(document.getElementById(idInputnum1).value)
            let num2 =parseFloat(document.getElementById(idInputnum2).value); //parseFloat(document.getElementById(idInputnum2).value)
            document.getElementById(idInputresult).value =cases(idselectopt, num1, num2);
        }

    </script>
</body>

</html>

 

komentarz 17 grudnia 2021 przez VBService Ekspert (255,440 p.)

@grzybownik420, zamień

<select name="lista_wynikow"> 
    <option id="suma"> + </option> 
    <option id="roznica"> - </option> 
    <option id="mnozenie"> * </option> 
    <option id="iloraz"> / </option> 
</select>

na

<select id="lista_wynikow" name="lista_wynikow"> 
    <option value="suma"> + </option> 
    <option value="roznica"> - </option> 
    <option value="mnozenie"> * </option> 
    <option value="iloraz"> / </option> 
</select>

wtedy w js-ie masz np.:

var action=document.getElementById("lista_wynikow").value;
console.log(action);

 

2 odpowiedzi

+1 głos
odpowiedź 15 grudnia 2021 przez KlemensGak Bywalec (2,210 p.)

Najlepiej będzie jak podglądniesz sobie z takiego Tutorialka, który odpowiada na twoje pytanie :)

https://www.youtube.com/watch?v=U5uKj7KpKV8

0 głosów
odpowiedź 14 grudnia 2021 przez Wiciorny Ekspert (275,550 p.)

Możesz zaimplementować własną funkcje zbierającą odpowiednią operacje i wtedy wykonać odpowiednie działanie 
https://www.tabnine.com/academy/javascript/how-to-use-option-selected-property/

<select id="greet" onchange="getOption(this)">
  <option>Pick your greet</option>
  <option value="hello">Hello</option>
  <option value="goodbye">Goodbye</option>
  <option value="seeYou">See you...</option>
</select>
function getOption(el) {
  const option = el.value;
  if (option === 'esc') return
    console.log(option);
  return option;
}

 

Podobne pytania

+1 głos
1 odpowiedź 678 wizyt
0 głosów
2 odpowiedzi 676 wizyt
pytanie zadane 1 września 2016 w PHP przez Miszo Bywalec (2,100 p.)
0 głosów
1 odpowiedź 3,440 wizyt
pytanie zadane 22 lipca 2016 w PHP przez Koncha Bywalec (2,860 p.)

92,839 zapytań

141,780 odpowiedzi

320,848 komentarzy

62,171 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...