29 августа 2011 г.

Функция форматирования числа на Javascript

Мой велосипед форматирования числа на Javascript.

Устаревшая версия! Новую можно посмотреть здесь.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Format Number Example</title>
<script type="text/javascript">

/**
 * Это - та самая функция форматирования числа.
 * Start
 */
function format_number(theStr) {
    var theStr, delim = ' ';
    
    var removeSpaces = function remove_spaces(str) {
        var str;
        return str.split(' ').join('');
    }
    theStr = removeSpaces(theStr);
    
    var getParts = function (str, target) {
        var str, target;
        if (str.indexOf(target) != -1)
            return str.split(target);
        else
            return false;
    }
    var dots = ['.', ','];
    for (var d in dots) {
        var dot = dots[d];
        var parts = getParts(theStr, dot) || [];
        if (parts) break;
        
    }
    
    var integ = '', fract = '';
    if (parts.length > 1) {
        integ = parts.shift();
        fract = parts.join(dot);
    }
    else integ = theStr;
    
    var temp = [];
    var addit = '';
    for (var i = integ.length - 1, j = 0; i >= 0; i--, j++) {
        var ch = integ[i];
        if (ch.charCodeAt(0) < 48 || ch.charCodeAt(0) > 57) {
            temp.unshift(ch);
            j--;
            continue;
        }
        addit = (j % 3 == 0 && j != 0) ? delim : '';
        temp.unshift(ch, addit);
    }
    
    if (fract != '') temp.push(dot, fract);
    
    return temp.join('');
}
/**
 * End
 */

/**
 * А это уже тестовое воплощение
 */
window.onload = function () {
    var textField = document.getElementById('textfield');
    var resultHolder = document.getElementById('resultholder');
    var processTest = function () {
        resultHolder.innerHTML = format_number( textField.value );
    }
    
    processTest();
    textField.onkeyup = function () {
        processTest();
    }
    textField.onblur = function () {
        processTest();
    }
}

</script>
</head>
<body>
    <h1>Format Number Example</h1>
    <p>Type something into the textfield.</p>
    <input id="textfield" type="text" style="width:400px;" value="1234567" />
    <p>Result of number formatting is: <b id="resultholder"></b></p>
</body>
</html>

4 комментария:

Unknown комментирует...

Друг, ещё бы примеров добавить в конце...

Иван комментирует...

Ну, если от "start" и до "end" сам модуль, то применять можно хоть как. Например:

num = format_number( num.toString() );

А вообще хорошо вешать функцию на события изменения в текстовых полях, где числа (для этого и писалось), как в примере. Или, для jQuery, к примеру:

$('какой-то элемент input:text')
.keyup( function (event){ $(this).val( format_number( $(this).val() ) ) });

Анонимный комментирует...

function format_number(theStr) {
var theStr...

function (str, target) {
var str, target; ...

ОФИГЕТЬ !!!

Иван комментирует...

Ну, да. Можно убрать. Чего же так переживать-то? :)

Отправить комментарий