Image placeholder

number-divider.js – jQuery数字分配器插件

Image placeholder
F2EX 2016-12-29

number-divider.js 是一个用于分配数字的 jQuery 插件,你可以在输入和简单的 HTML 标记中分配数字。如果你希望在表单中使用它,那么格式化的值将在原始值上自动替换。

用法

引入 js 文件。

<script type="text/javascript" src="dist/number-divider.min.js"></script>

将所有需要分配输入的类型设为 ‘text’

原始数字你可以使用 jQuery val() 得到:

$('#myinput').val();

示例

你可以使用默认参数:

$('#input').divide();

或者可以指定参数:

$('#input').divide({
    delimiter:' ',
    divideThousand:false
});

此外,你可以在简单的HTML标记中分割数字:

<div class="divide">1000</div>
<span class="divide">10000</span>
<label class="divide">1000000</label>

甚至混合他们:

<div class="divide">1000</div>
<input class="divide" type="text">

在上面这种情况下,如果你执行 $('.divide') 。那么所有输入都绑定在更改事件,其他标签只被处理一次。

如果你希望在表单中使用它,那么格式化的值将在原始值上自动替换:

<form method="get">
    <label>Simple GET form</label>
    <p><input class="divide" name="login" placeholder="Enter login" required type="text"></p>
    <p><input class="divide" name="password" placeholder="Enter password" required type="text"></p>
    <button type="submit">Confirm</button>
</form>

你不需要做任何额外的事情,插件会自动为你完成!

选项

以下是选项和匹配默认值的完整列表:

{
    delimiter: ',',                 // current delimiter
    divideThousand: true,           // 1,000..9,999
    delimiterRegExp: /[\.\,\s]/g    // available delimiters
}

2016-12-29