Visualizzazione dei risultati da 1 a 5 su 5

Hybrid View

  1. #1

    Problema con codice Javascript per l'incremento

    Salve a tutti,

    volevo chiedervi un consiglio riguardo a un codice Javascript su cui stò avendo qualche problema riguardo all'incremento. La mia situazione è questa:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Verifica Web Marketing</title>
    <meta name="keywords" content="Ristorante Firenze, Tagliata Firenze, Carne Firenze, Vino Firenze" />
    <meta name="description" content="Clean Type Firenze, il ristorante dove mangiare bene e di qualità! Bere il buon vino toscano! " />
    <style>

    body{
    margin: 0;
    padding: 0;
    }

    #container{
    width: 1000px;
    margin: 0 auto;
    }

    #header{
    width: 1000px;

    }

    #main{
    width: 1000px;
    float: left;
    margin: 0 auto;
    margin-top: 30px;
    }

    #cont-main{
    width: 800px;
    height: 500px;
    margin: 0 auto;
    }

    #cont-text{
    width: 400px;
    float: right;
    margin-top: 50px;
    font-size: 18px;
    }

    #cont-text b{
    color: #FF9900;
    }

    #edit-for{
    float: right;
    width: 400px;
    margin-top: -80px;
    }

    .part-tex{
    margin-left:-200px;
    float: left;
    }


    .apri:hover{ cursorointer;}
    .chiudi{ font-size:18px; color:#000; font-weight:bold; position:absolute; right:2%; top:0%; cursorointer;}

    .titolo_box{ margin-left:20px;}
    #box{ border: 1px solid #000; width:600px; height:600px; background-color:#FFF; display:none; z-index:+300; position:absolute; left:30%; top:20%; -moz-border-radius: 15px; -webkit-border-radius: 15px;
    border-radius: 15px;}

    #mod-sta{
    margin-top: -120px;
    margin-left: 20px;
    }

    #mod-sta ul{
    float: left;
    margin-left: -45px;
    margin-top: -10px;
    }

    #mod-sta ul li{
    list-style: none;
    margin-top: 10px;
    }

    .overlay{
    background:#000;
    position:fixed;
    top:0px;
    bottom:0px;
    left:0px;
    right:0px;
    z-index:100;
    cursorointer;
    /*Trasperenza cross browser*/
    opacity: .7; filter: alpha(opacity=70);
    -ms-filter:"progidXImageTransform.Microsoft.Alpha(Opacity=70)";

    }

    </style>

    <script type="text/javascript">

    function UpdateCost() {
    var sum = 0.50;
    var gn, elem;
    for (i=0; i<2; i++) {
    gn = 'game'+i;
    elem = document.getElementById(gn);
    if (elem.checked == true) {
    sum = Number(elem.value);


    }
    }
    document.getElementById('totalcost').value = sum.toFixed(2);
    }



    </script>

    <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
    //Funzione per arrotondamento a due cifre decimali e aggiunta di zeri
    function cifre_decimali(x) {
    var c = String(Math.round(x*100));
    while (c.length < 3) c = '0' + c;
    return c.replace(/([0-9][0-9])$/,".$1");
    }
    //Funzione per l'aggiornamento in tempo reale del costo totale degli articoli
    function calcola () {
    //Prelevo il prezzo
    var prezzo = parseFloat(document.modulo.prezzo.value);
    //Prelevo il numero articoli
    var articoli = parseFloat(document.modulo.articoli.value);
    var calcola_somma = 0.00;
    //Calcolo la somma
    calcola_somma = Math.round(prezzo * articoli * 100)/100;
    //Scrivo la somma nel campo aggiungendo zero qual'ora non ci fossero
    document.modulo.somma.value=cifre_decimali(calcola _somma);
    }
    //-->
    </SCRIPT>

    <script src="js/jquery.js" type="text/javascript"></script>

    <script>

    $(document).ready(function() {

    $(".apri").click(
    function(){
    $('#overlay').fadeIn('fast');
    $('#box').fadeIn('slow');
    });

    $(".chiudi").click(
    function(){
    $('#overlay').fadeOut('fast');
    $('#box').hide();
    });

    $("#overlay").click(
    function(){
    $(this).fadeOut('fast');
    $('#box').hide();
    });



    });

    </script>

    </head>
    <body>

    <div id="container">

    <div id="header">
    <img src="images/banner.jpg"/>
    </div>

    <div id="main">

    <div id="cont-main">
    <img src="images/product01.jpg"/>

    <div id="cont-text">
    <b>Penna gel Niceday</b>
    <p>Penna gel Niceday grip tratto medio colore rosso, conf. da 12 pz
    Codice Articolo QM1-1621903
    </p>

    <p style="font-weight:bold;font-size:20px;color:#f00;">A partire da
    € 0,50 / penna
    </p>
    </div>

    <form id="edit-for" name="modulo" action="acquista.html" method="post" >
    <h3>Aggiungi opzione</h3>
    <table border="0" cellspacing="2" cellpadding="2">

    <tr>
    <td><input name="Dinamica" type="radio" id='game0' onclick="UpdateCost()" value="0.50" checked="checked" /></td>
    <td class="part-tex">Senza stampa</td>
    <td></td>
    </tr>

    <tr>
    <td><input name="Dinamica" type="radio" id='game1' onclick="UpdateCost()" value="1.00" /></td>
    <td class="part-tex"><p class="apri"><input type="button" value="Con stampa" name="nome"></p></td>
    </tr>

    <tr>
    <td><h3>Quantità</h3></td>
    </tr>

    <tr>

    <td>Prezzo Articolo =
    <INPUT NAME="prezzo" TYPE="TEXT" value="19.90" SIZE="5" maxlength="5" readonly id="prezzo"><br />
    Numero Articoli =
    <select name="articoli" id="articoli" onChange="calcola();">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    </select><br />
    Costo Totale = <INPUT NAME="somma" TYPE="TEXT" value="19.90" SIZE="5" maxlength="5"></td>
    </tr>

    <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    </tr>

    <tr>
    <td>totale offerta iva inclusa €: <input name="Totale" type="text" class="testototale" id="totalcost" value="0.50" size="8" /></td>
    </tr>

    <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    </tr>

    <tr>
    <td><input type="submit" value="Aggiungi al Carrello"></td>
    <td></td>
    </tr>

    </table>

    </form>

    <div class="overlay" id="overlay" style="display:none;"></div>

    <div id="contenuto">

    <br />
    </div>



    <div id="box">

    <h2 class="titolo_box">Preferenze di stampa</h2>
    <hr/>
    <form id="mod-sta" name="modulo2" action="" method="post">
    <table>

    <tr>
    <td><h3>Colore</h3></td>
    </tr>

    <tr>
    <td>
    <select name="nome">
    <option value="nero">Nero</option>
    <option value="rosso">Rosso</option>
    <option value="bianco">Bianco</option>
    </select>
    </td>
    </tr>

    <br/>
    <br/>

    <tr>

    <td><h3>Tipologia di stampa</h3></td>
    </tr>

    <td>
    <ul>
    <li><input type="radio" id='game0' onclick="UpdateCost()" value="1.00" name="Dinamica" value="Serigrafia" checked>Serigrafia</li>
    <li><input type="radio" id='game1' onclick="UpdateCost()" value="1.50" name="Dinamica" value="Tampografia">Incisione</td></li>
    </ul>
    </td>
    <br/>
    <br/>
    <tr>

    <td><h3>Tipo di font</h3></td>
    </tr>

    <tr>
    <td>

    <select name="nome">
    <option value="nero">Arial</option>
    <option value="rosso">Vardana</option>
    <option value="bianco">Times New Roman</option>
    </select>

    </td>

    </tr>

    <br/>
    <br/>

    <tr><td><h3>Scrivi il testo che desideri stampare</h3></td></tr>
    <tr>
    <td><textarea name="nome_testo" cols="22" rows="5" style="width:300px;height:50px;"></textarea></td>
    </tr>

    <tr>
    <td>&nbsp;</td>
    </tr>

    <tr>
    <td>totale offerta iva inclusa €: <input name="Totale" type="text" class="testototale" id="totalcost" value="1.00" size="8" /></td>
    </tr>

    </table>
    </form>



    <p class="chiudi">X</p>
    </div>



    </div>

    </div>

    </div>

    </body>

    </html>
    Come vedete, stò gestendo la vendita online di una penna, e il problema che ho è che non riesco a incrementare il prezzo quando vado a selezionare la quantità di penne. Praticamente non mi va a sommare il prezzo con la scelta del "prodotto + stampa del marchio (con la varie caratteristiche) + la quantità". La funzione UpdateCost() funziona solo con la scelta multipla ma non con le altre scelte.

    Come potrei fare?

    Grazie in anticipo.
    Ultima modifica di GabrielsDesign; 08-01-2015 a 11:12

  2. #2
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    passa il valore al click onclick="UpdateCost(this.value)"
    function UpdateCost(prezzo) {
    var sum = 0.50;

    sum = Number(prezzo);

    document.getElementById('totalcost').value = sum.toFixed(2);
    }
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  3. #3
    Ho provato ma non viene nulla, la funzione la deve sostituire a quella precendete o devo aggiungerla?

    Al momento la mia situazione è questa:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Verifica Web Marketing</title>
    <meta name="keywords" content="Ristorante Firenze, Tagliata Firenze, Carne Firenze, Vino Firenze" />
    <meta name="description" content="Clean Type Firenze, il ristorante dove mangiare bene e di qualità! Bere il buon vino toscano! " />
    <style>

    body{
    margin: 0;
    padding: 0;
    }

    #container{
    width: 1000px;
    margin: 0 auto;
    }

    #header{
    width: 1000px;

    }

    #main{
    width: 1000px;
    float: left;
    margin: 0 auto;
    margin-top: 30px;
    }

    #cont-main{
    width: 800px;
    height: 500px;
    margin: 0 auto;
    }

    #cont-text{
    width: 400px;
    float: right;
    margin-top: 50px;
    font-size: 18px;
    }

    #cont-text b{
    color: #FF9900;
    }

    #edit-for{
    float: right;
    width: 400px;
    margin-top: -80px;
    }

    .part-tex{
    margin-left:-200px;
    float: left;
    }


    .apri:hover{ cursorointer;}
    .chiudi{ font-size:18px; color:#000; font-weight:bold; position:absolute; right:2%; top:0%; cursorointer;}

    .titolo_box{ margin-left:20px;}
    #box{ border: 1px solid #000; width:600px; height:600px; background-color:#FFF; display:none; z-index:+300; position:absolute; left:30%; top:20%; -moz-border-radius: 15px; -webkit-border-radius: 15px;
    border-radius: 15px;}

    #mod-sta{
    margin-top: -120px;
    margin-left: 20px;
    }

    #mod-sta ul{
    float: left;
    margin-left: -45px;
    margin-top: -10px;
    }

    #mod-sta ul li{
    list-style: none;
    margin-top: 10px;
    }

    .overlay{
    background:#000;
    position:fixed;
    top:0px;
    bottom:0px;
    left:0px;
    right:0px;
    z-index:100;
    cursorointer;
    /*Trasperenza cross browser*/
    opacity: .7; filter: alpha(opacity=70);
    -ms-filter:"progidXImageTransform.Microsoft.Alpha(Opacity=70)";

    }

    #sub-main{
    width: 315px;
    height: 450px;
    float: left;
    margin: 0 auto;
    }

    #delivery{
    width: 315px;
    height: 450px;
    background-color: blue;
    text-align: center;
    }

    #sub-main{
    display:none;
    }

    #delivery table{
    margin-top: -90px;
    }

    .same{
    margin-top: 100px;
    }

    </style>

    <script type="text/javascript">

    function UpdateCost(prezzo) {
    var sum = 0.50;

    sum = Number(prezzo);

    document.getElementById('totalcost').value = sum.toFixed(2);
    }

    </script>

    <script type="text/javascript">



    </script>

    <script src="js/jquery.js" type="text/javascript"></script>

    <script>

    $(document).ready(function() {
    $(".same").click(function(){
    $("#sub-main").slideToggle("slow");
    });
    });

    </script>

    </head>
    <body>

    <div id="container">

    <div id="header">
    <img src="images/banner.jpg"/>
    </div>

    <div id="main">

    <div id="cont-main">
    <img src="images/product01.jpg"/>

    <div id="cont-text">
    <b>Penna gel Niceday</b>
    <p>Penna gel Niceday grip tratto medio colore rosso, conf. da 12 pz
    Codice Articolo QM1-1621903
    </p>

    <p style="font-weight:bold;font-size:20px;color:#f00;">A partire da
    € 0,50 / penna
    </p>
    </div>

    <form id="edit-for" name="form1" action="acquista.html" method="post" >
    <h3>Aggiungi opzione</h3>
    <table border="0" cellspacing="2" cellpadding="2">

    <tr>

    <td>

    Quantita' <input name="primo" type="textbox" onKeyUp="HandleKey()" value="0"><br />
    </td>
    </tr>

    <tr><td>&nbsp;</tr></tr>

    <tr>
    <td><input name="secondo" type="radio" onclick="UpdateCost(this.value)" value="1" /></td>
    <td class="part-tex">Senza stampa</td>
    <td></td>
    </tr>



    <tr>
    <td><input name="secondo" type="radio" onclick="UpdateCost(this.value)" value="2" /></td>
    <td class="part-tex"><p class="apri"><div id="sub-main">
    <div class="evento">
    <table>

    <tr>
    <td><h3>Colore</h3></td>
    </tr>

    <tr>
    <td>
    <select name="nome">
    <option value="nero">Nero</option>
    <option value="rosso">Rosso</option>
    <option value="bianco">Bianco</option>
    </select>
    </td>
    </tr>

    <tr>

    <td><h3>Tipologia di stampa</h3></td>
    </tr>

    <td>
    <ul>
    <li><input type="radio" onClick="HandleKey()" value="3" name="terzo"checked>Serigrafia</li>
    <li><input type="radio" onClick="HandleKey()" value="4" name="terzo">Incisione</td></li>
    </ul>
    </td>
    <br/>
    <br/>
    <tr>

    <td><h3>Tipo di font</h3></td>
    </tr>

    <tr>
    <td>

    <select name="nome">
    <option value="nero">Arial</option>
    <option value="rosso">Vardana</option>
    <option value="bianco">Times New Roman</option>
    </select>

    </td>

    </tr>

    <br/>
    <br/>

    <tr><td><h3>Scrivi il testo che desideri stampare</h3></td></tr>
    <tr>
    <td><textarea name="nome_testo" cols="22" rows="5" style="width:300px;height:50px;"></textarea></td>
    </tr>

    <tr>
    <td>&nbsp;</td>
    </tr>

    </table>

    </div>
    </div><input type="button" value="Con stampa" name="nome" class="same"></p></td>
    </tr>



    <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    </tr>

    <tr>
    <td>totale offerta iva inclusa €: <input name="somma" type="textbox" value="0"></td>
    </tr>

    <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    </tr>

    <tr>
    <td><input type="submit" value="Aggiungi al Carrello"></td>
    <td></td>
    </tr>

    </table>

    </form>






    </div>

    </div>



    </div>

    </div>

    </body>

    </html>

    Grazie.

  4. #4
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Scusa Gabriel ma il codice html è scritto malissimo e non sai realizzare uno script js, sicuro che sia il caso di proseguire? Maglio se prima studi html e js
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  5. #5
    Lo so, l'ordine del linguaggio è obrobrioso. Ho fatto di corsissima perchè stavo provando una cosa ecco perchè. Sono un Web Designer, figurati se scrivo cosi il codice. Ahahah!

    Comunque, ho già risolto, tutto apposto, il topic puoi chiuderlo!

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.