jquery - remove - Cómo forzar adición en lugar de concatenación en javascript

remove attribute jquery

Question

Esta pregunta ya tiene una respuesta aquí:

• Cómo forzar a JS a hacer matemática en lugar de poner dos cadenas juntas 7 respuestas

Estoy tratando de agregar todos los contenidos de calorías en mi javascript de esta manera:

$(function() {
    var data = [];

    $( "#draggable1" ).draggable();
    $( "#draggable2" ).draggable();
    $( "#draggable3" ).draggable();

    $("#droppable_box").droppable({
        drop: function(event, ui) {
            var currentId = $(ui.draggable).attr(''id'');
            var total = 0;
            data.push($(ui.draggable).attr(''id''));

            if(currentId == "draggable1"){
            var myInt1 = parseFloat($(''#MealplanCalsPerServing1'').val());
            }
            if(currentId == "draggable2"){
            var myInt2 = parseFloat($(''#MealplanCalsPerServing2'').val());
            }
            if(currentId == "draggable3"){
            var myInt3 = parseFloat($(''#MealplanCalsPerServing3'').val());
            }
        if ( typeof myInt1 === ''undefined'' || !myInt1 ) {
        myInt1 = parseInt(0);
        }
        if ( typeof myInt2 === ''undefined'' || !myInt2){
        myInt2 = parseInt(0);
        }
        if ( typeof myInt3 === ''undefined'' || !myInt3){
        myInt3 = parseInt(0);
        }
        total = parseFloat(myInt1 + myInt2 + myInt3);
        $(''#response'').append(total);
        }
    });
    $(''#myId'').click(function(event) {
        $.post("process.php", ({ id: data }), function(return_data, status) {
            alert(data);
            //alert(total);
        });
    });
});

En lugar de agregar las variables, se concatenan. Intenté usar parseInt, parseFloat y Number pero aún así obtuve concatenación y no suma. Mire la fuente de la vista en http://maureenmoore.com/momp_112412/121912_800.html

Answer 1

La siguiente declaración agrega el valor al elemento con el id de response

$(''#response'').append(total);

Esto hace que parezca que estás concatenando las cuerdas, pero no lo estás, en realidad las estás añadiendo al elemento

cambiar eso a

$(''#response'').text(total);

Necesita cambiar el evento de caída para que reemplace el valor del elemento con el total, también necesita hacer un seguimiento de lo que es el total, sugiero algo como lo siguiente

$(function() {
    var data = [];
    var total = 0;

    $( "#draggable1" ).draggable();
    $( "#draggable2" ).draggable();
    $( "#draggable3" ).draggable();

    $("#droppable_box").droppable({
        drop: function(event, ui) {
        var currentId = $(ui.draggable).attr(''id'');
        data.push($(ui.draggable).attr(''id''));

        if(currentId == "draggable1"){
            var myInt1 = parseFloat($(''#MealplanCalsPerServing1'').val());
        }
        if(currentId == "draggable2"){
            var myInt2 = parseFloat($(''#MealplanCalsPerServing2'').val());
        }
        if(currentId == "draggable3"){
            var myInt3 = parseFloat($(''#MealplanCalsPerServing3'').val());
        }
        if ( typeof myInt1 === ''undefined'' || !myInt1 ) {
            myInt1 = parseInt(0);
        }
        if ( typeof myInt2 === ''undefined'' || !myInt2){
            myInt2 = parseInt(0);
        }
        if ( typeof myInt3 === ''undefined'' || !myInt3){
        myInt3 = parseInt(0);
        }
        total += parseFloat(myInt1 + myInt2 + myInt3);
        $(''#response'').text(total);
        }
    });

    $(''#myId'').click(function(event) {
        $.post("process.php", ({ id: data }), function(return_data, status) {
            alert(data);
            //alert(total);
        });
    });
});

Moví la var total = 0; declaración fuera del evento drop y cambió la declaración de asignación de este

total = parseFloat(myInt1 + myInt2 + myInt3);

a esto

total += parseFloat(myInt1 + myInt2 + myInt3);

Aquí hay un ejemplo de trabajo http://jsfiddle.net/axrwkr/RCzGn/

Answer 2

Su código concatena tres cadenas y luego convierte el resultado en un número.

Necesita convertir cada variable a un número llamando a parseFloat() alrededor de cada uno.

total = parseFloat(myInt1) + parseFloat(myInt2) + parseFloat(myInt3);

Answer 3

También debería ser capaz de hacer esto:

total += eval(myInt1) + eval(myInt2) + eval(myInt3);

Esto me ayudó en una situación diferente, pero similar.