auswählen - Wie summiert man die Werte ausgewählter Optionen mit jquery?

Question

Wie summiert man die Auswahlmöglichkeiten in mehreren Attributen? Irgendeine Idee, was könnte das Problem sein?

$(document).ready(function() { $('#btn-add').click(function(){ 
    $('#select-from option:selected').each(function() { 
      $('#select-to').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>"); 
     $(this).remove(); 
    }); 
}); 
$('#btn-remove').click(function(){ 
    $('#select-to option:selected').each(function() { 
     $('#select-from').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>"); 
     $(this).remove(); 
    }); 

}); 

$('.select-from option:selected').change(function() { 
var total = 0 ; 
    $('.select-to option:selected').each(function() { 
     total += parseInt($(this).value()); 
    }); 
       $("input[name=class]").value(total); }); }); 

Ich habe eine Vielzahl von Optionen Auswahlliste

<select name="selectfrom" id="select-from" multiple size="5"> 
    <option value="1">Item 1</option> 
    <option value="2">Item 2</option> 
    <option value="3">Item 3</option> 
    <option value="4">Item 4</option> 
</select> 

<a href="JavaScript:void(0);" id="btn-add">Add &raquo;</a> 
<a href="JavaScript:void(0);" id="btn-remove">&laquo; Remove</a> 

<select name="selectto" id="select-to" multiple size="5"> 
</select> <input type="text" name="class" value="" /> 

Answer 1

Versuchen Sie den folgenden Code.

$(document).ready(function() { 
 
    
 
$('#btn-add').click(function(){ 
 
    $('#select-from option:selected').each(function() { 
 
      $('#select-to').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>"); 
 
     $("input[name='class']").val(parseInt($(this).val()) + parseInt($("input[name='class']").val())); 
 
    }); 
 
}); 
 
$('#btn-remove').click(function(){ 
 
    $('#select-to option:selected').each(function() { 
 
     $('#select-from').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>"); 
 
     $(this).remove(); 
 
     $("input[name='class']").val(parseInt($("input[name='class']").val() - parseInt($(this).val()))); 
 
    }); 
 

 
}); 
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select name="selectfrom" id="select-from" multiple size="5"> 
 
    <option value="1">Item 1</option> 
 
    <option value="2">Item 2</option> 
 
    <option value="3">Item 3</option> 
 
    <option value="4">Item 4</option> 
 
</select> 
 

 
<a href="JavaScript:void(0);" id="btn-add">Add &raquo;</a> 
 
<a href="JavaScript:void(0);" id="btn-remove">&laquo; Remove</a> 
 

 
<select name="selectto" id="select-to" multiple size="5"> 
 
</select> <input type="text" name="class" value="0" />

Answer 2

Sie verwenden .value() statt .val()

ändern total += parseInt($(this).value());-total += parseInt($(this).val()); und $("input[name=class]").value(total); zu $("input[name=class]").val(total);