Разделитель номера jQuery - Отдельный номер для каждой 1000 - PullRequest
0 голосов
/ 19 мая 2010

Я разрабатываю новый сайт, и здесь пользователь может ввести цену в поле ввода текста. Итак, что мне нужно, это некоторый jQuery-код для преобразования набранной цены. Это означает, что когда пользователь вводит «1000», видимый текст в поле ввода автоматически преобразуется в «1000» - с точкой. И если они набирают «10000», его следует преобразовать в «10.000» и т. Д. Вы можете увидеть живой пример на этом сайте, который я нашел: http://www.boligsiden.dk/ Я знаю, что это на датском, но на первой странице под картой есть поля для ввода. Один из них говорит «Минимальный контактприс». Вы можете попробовать ввести число здесь и увидеть эффект, который я ищу.

Кто-нибудь знает, как мне этого добиться? Либо с помощью плагина jQuery, либо с помощью какого-то "домашнего" кода?

Ответы [ 3 ]

2 голосов
/ 19 мая 2010
1 голос
/ 19 мая 2010

JavaScript: хорошие детали

Не забудьте поблагодарить http://www.boligsiden.dk

function NumericBox_KeyDown(o, e, separate, allowComma) {
    o.onkeypress = o.onkeyup = null;
    if (!e) e = window.event;
    var code = e.keyCode;
    if (!code && e.which) code = e.which;
    if (code >= 96 && code <= 105) code -= 48;
    var preventDefault = ((code > 57 && (code != 110 && code != 188)) || code == 32 || (code >= 48 && e.shiftKey));
    if (!allowComma && (code == 188 || code == 110)) preventDefault = true;
    if (!preventDefault) {
        if (separate) {
            if (NumericBox_CanSelect(o)) {
                if (((code >= 48 && code <= 57) || code == 8 || code == 46 || code == 110 || code == 188)) {
                    preventDefault = NumericBox_FormatNumber(o, code, allowComma);
                }
            }
        }
    }
    if (preventDefault) {
        o.onkeypress = o.onkeyup = function (e) {
            if (!e) e = window.event;
            return false;
        };
        return false;
    }
    return true;
}

function NumericBox_CanSelect(o) {
    return (typeof(o.createTextRange) != 'undefined' || typeof(o.selectionStart) != 'undefined');
}

function NumericBox_FormatNumber(o, code, allowComma) {
    if (!allowComma && (code == 188 || code == 110)) return true;
    var preventDefault = false;
    var startPos = getSelectionStart(o);
    var endPos = getSelectionEnd(o);
    var s = o.value;

    //delete all non numbers except one optional comma
    var i = o.value.length - 1;
    while (i >= 0) {
        var c = s.charAt(i);
        if (c < '0' || c > '9') {
            if (c == ',' && allowComma == true) {
                allowComma = false;
            } else {
                s = s.substring(0, i) + s.substring(i + 1);
                if (startPos > i) startPos--;
                if (endPos > i) endPos--;
            }
        }
        i--;
    }
    if (startPos == 1 && s.charAt(0) == '0' && code == 48) preventDefault = true;
    if (startPos == 0 && s.length > 0 && code == 48) preventDefault = true;
    while (s.length > 0 && s.charAt(0) == '0' && s.charAt(1) != ',' && code != 48) {
        s = s.substring(1);
        startPos--;
        endPos--;
    }
    if (code == 188 || code == 110) {
        preventDefault = !allowComma;
        if (allowComma && startPos == 0) {
            s = '0' + s;
            startPos++;
            endPos++;
        }
    }

    var s2 = s.substring(0, startPos);
    for (var k = startPos; k < endPos; k++)
    s2 += 'B';
    s2 += s.substring(endPos);
    var s3 = s2;
    var s4 = s;
    if (code >= 48 && code <= 57 && !preventDefault) {
        s3 = s3.substring(0, startPos) + 'A' + s3.substring(startPos);
        s4 = s4.substring(0, startPos) + 'A' + s4.substring(startPos);
    }
    if (code == 8 && startPos == endPos && !preventDefault) {
        if (s3.charAt(startPos - 1) == ',') {
            s3 = s3.substring(0, startPos - 1) + 'B' + s3.substring(startPos);
        } else {
            s3 = s3.substring(0, startPos) + 'C' + s3.substring(startPos);
            s4 = s4.substring(0, startPos) + 'C' + s4.substring(startPos);
        }
    }
    if (code == 46 && startPos == endPos && !preventDefault) {
        if (s3.charAt(startPos) == ',') {
            s3 = s3.substring(0, startPos) + 'B' + s3.substring(startPos + 1);
        } else {
            s3 = s3.substring(0, startPos + 1) + 'C' + s3.substring(startPos + 1);
            s4 = s4.substring(0, startPos + 1) + 'C' + s4.substring(startPos + 1);
        }
    }

    var commaPos = s3.indexOf(',');
    if (commaPos < 0) commaPos = s3.length;
    if ((code == 188 || code == 110) && !preventDefault) commaPos = startPos;
    var j = 0;
    for (var l = commaPos; l > 0; l--) {
        if (s3.charAt(l) == 'C') j -= 2;
        if (j > 2) {
            if (l <= startPos) {
                startPos++;
                endPos++;
            }
            s4 = s4.substring(0, l) + '.' + s4.substring(l);
            j = 0;
        }
        if (s3.charAt(l - 1) != 'B') j++;
    }

    o.value = s4.replace('A', '').replace('C', '');
    setCursorPosition(o, startPos, endPos);
    if (typeof(document.execCommand) != 'undefined') try {
        document.execCommand('OverWrite', false, false);
    } catch (e) {}
    return preventDefault;
}


function getSelectionStart(o) {
    if (o.createTextRange) {
        var r = document.selection.createRange().duplicate()
        r.moveEnd('character', o.value.length)
        if (r.text == '') return o.value.length
        return o.value.lastIndexOf(r.text)
    } else return o.selectionStart
}

function getSelectionEnd(o) {
    if (o.createTextRange) {
        var r = document.selection.createRange().duplicate()
        r.moveStart('character', -o.value.length)
        return r.text.length
    } else return o.selectionEnd;
}
1 голос
/ 19 мая 2010

Я бы использовал числовой формат в php.js: http://phpjs.org/functions/number_format:481

затем сделайте что-то вроде этого:

$(element).change( function() {
    $(this).val( number_format( $(this).val(), 0, '.', '.' ) );
}
...