JQuery - измените значение флажка, нажав на него

Question

Я работаю над небольшим калькулятором с помощью jquery. Пока он работает отлично, но не с флажками. Флажок имеет значение по умолчанию = «200», но он должен только суммировать, если флажок установлен.

Надеюсь, вы меня поняли правильно! Heres мой код:

<div> 
<label for="horse">Horse</label> 
<select id="horse" class="" name="horse" title="" size="1"> 
<option value="0 ">choose</option> 
<option value="100">Horse 1 (+100 EUR)</option> 
<option value="200">Horse 2 (+200 EUR)</option> 
</select> 
</div> 
<div> 
<label for="saddle">Saddle</label> 
<select id="saddle" class="" name="sattel" title="" size="1"> 
<option value="0 ">choose</option> 
<option value="400.20">Saddle 1 (+400,20 EUR)</option> 
<option value="500.57">Saddle 2 (+500,57 EUR)</option> 
</select> 
</div> 
<div> 
<input type="hidden" alt="ghost" value="" name="pet"> 
<input id="pet" class="label_left" type="checkbox" name="haustier" title="" value="200"> 
<label for="pet">Pet?</label> 
</div> 
<div class="total"></div> 

и мой JQuery:

$(function() { 
$('#horse').change(endergebnis); 
$('#saddle').change(endergebnis); 
$("#pet").change(function() { 
    if ($('#pet:checked').val('')) { 
     $('#pet').val(); 
    } else { 
     $('#pet').val('0'); 
    } 

}); 
}); 
function endergebnis(){ 
var horse = $('#horse').val(); 
var saddle = $('#saddle').val(); 
var pet = $('#pet').val(); 

var total = 
    Number(horse) + 
    Number(saddle) + 
    Number(pet) 

$('.total').html(total + " EUR"); 
}; 

мой jsfidlle: http://jsfiddle.net/tobisagt/g2fsQ/372/

Answer 1

Вместо того чтобы использовать значение флажка Я просто использую щелкнутой атрибут как логическое и установив его на 200, если он установлен, это может конечно, в случае необходимости нужно извлечь переменную.

$(function() { 
    $('#horse').change(endergebnis); 
    $('#saddle').change(endergebnis); 
    $("#pet").change(endergebnis); 
}); 

function endergebnis() { 
    var horse = +$('#horse').val(); 
    var saddle = +$('#saddle').val(); 
    var pet = ($('#pet').attr('checked')) ? 200 : false; 
    if (pet) { 
     var total = (horse + saddle + pet).toFixed(2); 
     $('.total').html(total + " EUR"); 
    } else { 
     $('.total').html(""); 
    } 
} 

также заметить, что вместо того, чтобы использовать Number(var) Я использую сокращенную целое преобразование предваряя вариант выбора элемента с +.

Вот JSFiddle

EDIT - кажется, что я неправильно истолковал OP немного, см обновленной скрипки here где проверка домашних животных флажка добавляет 200 к значению, убрав удаляет 200 из значения, новый код:

function endergebnis() { 
    var horse = +$('#horse').val(); 
    var saddle = +$('#saddle').val(); 
    var pet = ($('#pet').attr('checked')) ? +$('#pet').val() : 0; 
    var total = (horse + saddle + pet).toFixed(2); 
    $('#total').html(total + " EUR"); 
} 

Answer 2

Вы хотите:

$(function() { 
    $('#horse').change(endergebnis); 
    $('#saddle').change(endergebnis); 

    $("#pet").data('val', '0'); 

    $("#pet").change(function() { 
     if ($(this).is(':checked')) { 
      $(this).data('val', $(this).val()); 
     } else { 
      $(this).data('val', '0'); 
     } 
     endergebnis(); 
    }); 
}); 
function endergebnis(){ 
    var horse = $('#horse').val(); 
    var saddle = $('#saddle').val(); 
    var pet = $("#pet").data('val'); 

    var total = 
     Number(horse) + 
     Number(saddle) + 
     Number(pet) 

    $('.total').html(total + " EUR"); 
}; 

Я переместил значение для объекта данных, так что вам не нужно вручную записывать «200» в javascript ..

Обновлено скрипка: http://jsfiddle.net/4LsA8/3/

Answer 3

попробовать этот

$(function() { 
     $('#horse').change(endergebnis); 
     $('#saddle').change(endergebnis); 
     //$("#pet").click(function() { 
     $('#pet').mousedown(function() { 
      if($('#pet').is(":checked")){ 
       $('#pet').val('0'); 
      } else { 
       $('#pet').val('200'); 
      } 
      endergebnis(); 
     }); 
    }); 
    function endergebnis(){ 
     var horse = $('#horse').val(); 
     var saddle = $('#saddle').val(); 
     var pet = $('#pet').val(); 

     var total = 
      Number(horse) + 
      Number(saddle) + 
      Number(pet) 

     $('.total').html(total + " EUR"); 
    }; 

живой скрипку here

Answer 4

попробовать это: (я переместил чек на флажке внутри расчета. если он не установлен, я установить значение 0!)

function endergebnis(){ 
    var horse = $('#horse').val(); 
    var saddle = $('#saddle').val(); 
    var pet = $('#pet').val(); 
if (!$('#edit-checkbox-id').is(':checked')) { 
    pet = 0; 
}; 


    var total = Number(horse) + Number(saddle) + Number(pet); 

    $('.total').html(total + " EUR"); 
};