Как правильно заменить символы «запятая» на «точка» в текстовом поле на jquery?

Question

[saveplanetfree]

Коллеги, написал небольшую функцию, которая производит расчет объема по введенным данным, возникла небольшая проблема, когда вводишь дробные значения через ЗАПЯТУЮ, то в результат выдает NaN, каким образом мне заменить запятую на точку? и по возможности наверно лучше дать возможность ввода только цифр с точкой.

<script type="text/javascript">
$(document).ready(function(){
    $(".typeoffoundation").change(function() {
        if ( $(this).val() == "Ленточный" ) { 
            $(".jinputs").show();
            $(".jinputs2").hide();
            $(".lenght").prop("required", true);
            $(".width").prop("required", true);
            $(".height").prop("required", true);
        }
        else if ( $(this).val() == "Фундаментная плита" ) {
            $(".jinputs2").show();
            $(".jinputs").hide();
            $(".lenght").prop("required", false);
            $(".width").prop("required", false);
            $(".height").prop("required", false);
            $(".area").prop("required", false);
            $(".height2").prop("required", true);
            $(".area2").prop("required", true);
        }
        else {
            $(".jinputs").hide();
            $(".jinput2").hide();
            $(".lenght").prop("required", false);
            $(".width").prop("required", false);
            $(".height").prop("required", false);
            $(".area").prop("required", false);
            $(".height2").prop("required", false);
            $(".area2").prop("required", false);
        }
    });
    $('.lenght').keyup(function () {
        var lenght = $(".lenght").val();
        var width = $(".width").val();
        var height = $(".height").val();
        if ( $(".typeoffoundation").val() == "Ленточный" &&  width.length > 0 && height.length > 0 && lenght.length > 0) {
            var result = lenght * width * height;
            $(".volume").val(result);
        }
    });
    $('.width').keyup(function () {
        var lenght = $(".lenght").val();
        var width = $(".width").val();
        var height = $(".height").val();
        if ( $(".typeoffoundation").val() == "Ленточный" &&  width.length > 0 && height.length > 0 && lenght.length > 0) {
            var result = lenght * width * height;
            $(".volume").val(result);
        }
    });
    $('.height').keyup(function () {
        var lenght = $(".lenght").val();
        var width = $(".width").val();
        var height = $(".height").val();
        if ( $(".typeoffoundation").val() == "Ленточный" &&  width.length > 0 && height.length > 0 && lenght.length > 0) {
            var result = lenght * width * height;
            $(".volume").val(result);
        }
    });
    $('.height2').keyup(function () {
        var area2 = $(".area2").val();
        var height2 = $(".height2").val();
        if ( $(".typeoffoundation").val() == "Фундаментная плита" &&  area2.length > 0 && height2.length > 0) {
            var result = area2 * height2;
            $(".volume").val(result);
        }
    });
    $('.area2').keyup(function () {
        var area2 = $(".area2").val();
        var height2 = $(".height2").val();
        if ( $(".typeoffoundation").val() == "Фундаментная плита" &&  area2.length > 0 && height2.length > 0) {
            var result = area2 * height2;
            $(".volume").val(result);
        }
    });
});
</script>

Answer 1

[Салават Ситдиков]

jQuery('input#elementId').val().replace(',', '.')

Answer 2

[Илья Лесных]

У вас нигде нет приведения типа через parseFloat, соответственно он делается автоматически.

"2.3" * 2 => 4.6
"2,3" * 2 => NaN

Либо делать parseInt() / Math.ceil() / Math.floor (тогда дробные части будут опущены), либо заменять запятую на точку и приводить к числу ( parseFloat("2,2".replace(',', '.')) ).

PS: пару советов по коду:
- замените свои if/elseif/else на switch
- кешируйте дублирующиеся jquery-селекторы

Answer 3

[Виталий Киренков]

Простите за мой французский, но какая же у вас порнография в скрипте...

Самое простое что могу вам посоветовать, копать в сторону функции .replace(), если немного точнее, то в момент получения значения делать замену - что то типа такого $(input).val().replace(",", ".");

Answer 4

[konstantinborodov]

jQuery('input#elementId').val().replace(',', '.') - здорово.

Можно так же подключить сторонний скрипт маски ввода для формы в котором принудительно эту точку ставить по умолчанию