Esto podría ser fácil, pero estoy un JQuery tonto y seguir recibiendo errores!

Básicamente, tengo un básico de JQuery 1.4+ función que actualiza un valor de entrada, pero ahora estoy teniendo un tiempo difícil averiguar cómo también el uso de JQuery para actualizar simultáneamente un texto en el área cuando los diferentes valores que se eligen con el selector desplegable. El Script y HTML se parece a esto:

JS:

$(function() {
  $('#mycups3').change(function() {
    var x = $(this).val();

    $('#myhidden3').val(x);
  });
});

HTML:

<form action="" method="post">
  <input type="hidden" id="myhidden3" name="quantity" value="1" />
  <input type="submit" name="submit" class="button" id="" value="Button" />
  <select id='mycups3'>
    <option value='1'>1 Item</option>
    <option value='2'>2 Items</option>
    <option value='3'>3 Items</option>
  </select>
  <span>$1.50</span>
</form>

Lo que quiero agregar:
Cuando se utiliza el selector desplegable, también quiero que el valor en el <span>$1.50</span> para actualizar. Ejemplo – la selección de un valor de ‘1’ hace que la cadena de texto en span mostrar $1.50 – selección de un valor de » 2 » en el menú desplegable que hace que la cadena de texto muestran $3.00 (o lo que sea), etc!

Las pistas que son muy apreciadas! Gracias!

  • Yo vi un par de sugerencias donde la gente obtiene el valor de la lista desplegable y multiplicar por 1.5, Recuerde usar parseInt() en x antes de usarlo en una expresión. Uso – parseInt(x) || 0 – donde 0 es la reserva si x no puede analizar (devuelve Nan)
InformationsquelleAutor Jamison | 2011-04-11

6 Comentarios

  1. 13

    Intente esto:

    <script type='text/javascript'>     
        $(function() {         
            $('#mycups3').change(function() {             
                var x = $(this).val();             
                $('#myhidden3').val(x);         
                $(this).next("span").text("$" + (x * 1.5).toFixed(2));
            });     
        }); 
    </script> 
    • Sí! Esta era una buena manera de hacerlo. Sólo una pregunta, aunque en el caso de que el resultado es de $4.5 – cómo asegurar que de otro ‘0’ se añade a hacer es de $4.50 ? Supongo que es un problema de formato, así que estoy tratando de experimentar con ellos .toFixed(); ?
    • Estás en lo correcto. Actualizado el post para uso toFixed.
  2. 3

    Me gustaría sugerir la adición de un identificador para el lapso de hacer algo como esto:

     $('#spanID').text($(this).val());
  3. 3

    Podría utilizar el .html() la función después de haber seleccionado el intervalo que desea modificar por ejemplo:

    $('span').html('$'+(x*1.5))
  4. 1

    Puede utilizar el texto de la función() para establecer u obtener el texto de un Elemento HTML (no funciona en los campos de entrada!). Su ejemplo de código podría tener este aspecto:

    <script type='text/javascript'>
    $(function() {
        $('#mycups3').change(function() {
            var x = $(this).val();
            $('#myhidden3').val(x);
            $('form span').text('$'+(x*1.5));
        });
    });
    </script>
  5. 1

    De trabajo ejemplo: http://jsfiddle.net/peeter/fyFxp/

    $(document).ready(function() {
        $('#itemQuantitySelect_3').change(function() {
    
            var itemPrice = 1.50;
            var itemQuantity = $(this).val();
            var quantityPrice = (itemPrice * itemQuantity).toFixed(2);
    
            $(this).next("span").html("$" + quantityPrice);
    
        });
    });

    He cambiado el código HTML un poco (más comprensible nombres de campo/IDs), pero usted debe tener la idea básica.

    Yo también quitó su campo oculto como no veo el punto de duplicar los datos. Su valor seleccionado en el cuadro de selección ya será enviado al servidor y, a continuación, usted tiene un campo oculto que hace exactamente lo mismo.

    Usted puede obtener la cantidad en el lado del servidor con la palabra clave itemQuantity_3 (en PHP $_POST[‘itemQuantity_3’]).

Dejar respuesta

Please enter your comment!
Please enter your name here