js货币格式化插件(currencyFmatter.js)

最简单示例

首先在页面中引入currencyFormatter.js文件。
<script src='currencyFormatter.js'></script>

HTML结构：
<div class='money'> 1234536.32 </div> 
<div class='money'> 8798458.11 </div>

OSREC.CurrencyFormatter.formatAll( 
{ 
  selector: '.money', 
  currency: 'CNY' 
});

currencyFmatter更多参数参考

过OSREC.CurrencyFormatter.format(number, parameters)方法可以非常容易的格式一个货币数值。只需要简单的在配置参数中设置你需要的格式即可。 参数的格式如下：

var parameters = 
{ 
  currency:   'EUR',      // If currency is not supplied, defaults to USD 
  symbol:   '?#39;,      // Overrides the currency's default symbol 
  locale:   'fr',     // Overrides the currency's default locale (see supported locales) 
  decimal:  ',',      // Overrides the locale's decimal character 
  group:    '.',      // Overrides the locale's group character (thousand separator) 
  pattern:  '#,##0.00 !'    // Overrides the locale's default display pattern 
    
  // The pattern follows standard unicode currency pattern notation. 
  // comma = group separator, dot = decimal separator, exclamation = currency symbol 
}

通常你不需要指定所有的参数。该插件会使用适当的格式来显示每一种货币和语言设置。

OSREC.CurrencyFormatter.format(2534234, { currency: 'INR' }); // Returns ? 25,34,234.00 
OSREC.CurrencyFormatter.format(2534234, { currency: 'EUR' }); // Returns 2.534.234,00 ?/code> 
OSREC.CurrencyFormatter.format(2534234, { currency: 'EUR', locale: 'fr' }); // Returns 2 534 234,00 ?

更多示例代码

通过OSREC.CurrencyFormatter.format(number, parameters)方法可以非常容易的格式一个数值。只需要简单的在配置参数中设置你需要的格式即可。

参数的格式如下：

    var parameters =
    {
    currency: 'EUR', // If currency is not supplied, defaults to USD
    symbol: '€', // Overrides the currency's default symbol
    locale: 'fr', // Overrides the currency's default locale (see supported locales)
    decimal: ',', // Overrides the locale's decimal character
    group: '.', // Overrides the locale's group character (thousand separator)
    pattern: '#,##0.00 !' // Overrides the locale's default display pattern

    // The pattern follows standard unicode currency pattern notation.
    // comma = group separator, dot = decimal separator, exclamation = currency symbol
    }

通常你不需要指定所有的参数。该插件会使用适当的格式来显示每一种货币和语言设置。

    OSREC.CurrencyFormatter.format(2534234, { currency: 'INR' }); // Returns ₹ 25,34,234.00
    OSREC.CurrencyFormatter.format(2534234, { currency: 'EUR' }); // Returns 2.534.234,00 €
    OSREC.CurrencyFormatter.format(2534234, { currency: 'EUR', locale: 'fr' }); // Returns 2 534 234,00 €

示例一：将数值作为货币值来进行格式

如果你需要将所有包含数值的元素都转换为好看的格式，你使用OSREC.CurrencyFormatter.formatAll(parameters)方法。

    <div class='money'> 1234536.32 </div>
    <div class='money'> 8798458.11 </div>

    // Applies a single currency format to all selected elements

    OSREC.CurrencyFormatter.formatAll(
    {
    selector: '.money',
    currency: 'CNY'
    });

示例二： Format each element with a specific currency

OSREC.CurrencyFormatter.formatEach(selector) 方法可以将页面中带有data-ccy属性的元素转换为不同的货币值。

    <div class='money' data-ccy='EUR'> 1234564.58 </div>
    <div class='money' data-ccy='GBP'> 8798583.85 </div>
    <div class='money' data-ccy='CHF'> 0.9754 </div>
    <div>Your INR value is: <span class='money' data-ccy='INR'> 322453.9754 </span></div>

    OSREC.CurrencyFormatter.formatEach('.money');

示例三： Fully bespoke data formatter

OSREC.CurrencyFormatter.getFormatter(parameters) 方法可以返回一个定制货币格式的函数。这是用于格式化大量数值的常用方法。

    <input id='frenchEuroInput' value='78234564.5815899' />

    // Once generated, the formatter below can used over
    // and over again to format any number of currencies

    var frenchEuroFormatter = OSREC.CurrencyFormatter.getFormatter
    ({
    // If currency is not supplied, defaults to USD
    currency: 'EUR',

    // Use to override the currency's default symbol
    symbol: '€',

    // Use to override the currency's default locale - every locale has
    // preconfigured decimal, group and pattern
    locale: 'fr',

    // Use to override the locale's default decimal character
    decimal: ',',

    // Use to override the locale's default group (thousand separator) character
    group: '.',

    // Use to override the locale's default display pattern
    // Note comma = group separator, dot = decimal separator, exclamation = symbol
    // Follows standard unicode currency pattern
    pattern: '#,##0.00 !'

    });

    var val = document.getElementById('frenchEuroInput').value;

    var formattedVal = frenchEuroFormatter(val);

    document.getElementById('frenchEuroInput').value = formattedVal;

示例四： Negative and Zero Formats

如果你需要区分负数，0和正数，你可以在模式参数中通过分号来指定它们各自的格式。如positivePattern;negativePattern;zeroPattern。 下面的例子指定瑞士法郎（CHF）的三种不同格式：

    <div class='money'> 7564.58 </div>
    <div class='money'> -4583.85 </div>
    <div class='money'> 0 </div>

    OSREC.CurrencyFormatter.formatAll
    ({
    selector: '.money',
    currency: 'CHF',
    pattern: '#,##0.00 !;(#,##0.00 !);0.00 !'
    });