Home » jQuery 外掛

[jQ]jQuery Price Format 1.7

範例 1
沒錯!只要 300 元就能獲得我們團隊完整的協助,讓效果能迅速的整合到您的網站,並保證瀏覽器的相容性。
立刻申請!



是否有時會苦腦怎樣顯示金錢格式才能讓使用者一目了然呢?jQuery Price Format 就是幫你把數字值轉換成各種指定格式的好幫手。

套件名稱:jQuery Price Format
套件版本:1.7
作者網站:http://jquerypriceformat.com/
套件網址:N/A
發佈日期:2012-02-22
檔案大小:6.23 KB
檔案下載:jquery.price_format.js

參數選項說明:

檢視原始碼 JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
prefix(選填)
描述: 要加在數字前面的金錢符號
預設值: 'US$ '
 
suffix(選填)
描述: 要加在數字後面的後綴符號
預設值: ''
 
centsSeparator(選填)
描述: 小數點的符號
預設值: '.'
 
thousandsSeparator(選填)
描述: 每千位數的區隔符號(就是三位一撇)
預設值: ','
 
limit(選填)
描述: 數字的長度;若為 false 表示不限制
預設值: false
 
centsLimit(選填)
描述: 小數點後面的數字長度
預設值: 2
 
clearPrefix(選填)
描述: 當輸入框失去焦點時是否移除數字前面的金錢符號
預設值: false
 
clearSufix(選填)
描述: 當輸入框失去焦點時是否移除數字後面的後綴符號
預設值: false
 
allowNegative(選填)
描述: 是否允許負值
預設值: false

方法說明:

檢視原始碼 JavaScript
1
2
// 把值轉換成 priceFormat 效果
$(selector).priceFormat(options);

使用範例:

檢視原始碼 JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.price_format.js"></script>
<script type="text/javascript">
	$(function(){
		// 預設的金錢格式
		$('#example1').priceFormat();
 
		// 在數字前面加上金錢符號為 R$ 且每千位數的區隔符號用 . 來區隔, 另外小數點的符號用 , 來區隔
		$('#example2').priceFormat({
			prefix: 'R$ ',
			centsSeparator: ',',
			thousandsSeparator: '.'
		});
 
		// 不在數字前面加上金錢符號及每三位數區隔
		$('#example3').priceFormat({
			prefix: '',
			thousandsSeparator: ''
		});
 
		// 數字最多 5 位, 且小數為 3 位
		$('#example4').priceFormat({
			limit: 5,
			centsLimit: 3
		});
 
		// 當輸入框失去焦點時移除金錢符號
		$('#example5').priceFormat({
			clearPrefix: true
		});
 
		// 允許負值
		$('#example6').priceFormat({
			allowNegative: true
		})
 
		// 在數字前面加上金錢符號為 R$, 在數字後面加上符號為 $$
		// 但當輸入框失去焦點時移除金錢符號及數字後面的符號
		$('#example7').priceFormat({
			prefix: 'R$',
			suffix: '$$',
			clearSuffix: true,
			clearPrefix: true
		});
	});
</script>
 
<body>
	<p>
		<h3>預設的金錢格式</h3>
		<input type="text" value="123456" id="example1" name="example1">
	</p>
	<p>
		<h3>在數字前面加上金錢符號為 R$ 且每千位數的區隔符號用 . 來區隔, 另外小數點的符號用 , 來區隔</h3>
		<input type="text" value="123456" id="example2" name="example2">
	</p>
	<p>
		<h3>不在數字前面加上金錢符號及每三位數區隔</h3>
		<input type="text" value="123456" id="example3" name="example3">
	</p>
	<p>
		<h3>數字最多 5, 且小數為 3</h3>
		<input type="text" value="123456" id="example4" name="example4">
	</p>
	<p>
		<h3>當輸入框失去焦點時移除金錢符號</h3>
		<input type="text" value="123456" id="example5" name="example5">
	</p>
	<p>
		<h3>預設的金錢格式</h3>
		<input type="text" value="-123456" id="example6" name="example6">
	</p>
	<p>
		<h3>在數字前面加上金錢符號為 R$, 在數字後面加上符號為 $$</h3>
		<h3>但當輸入框失去焦點時移除金錢符號及數字後面的符號</h3>
		<input type="text" value="123456" id="example7" name="example7">
	</p>
</body>
範例 1

檔案描述
基本的範例檔案(免空) 開始下載
基本的範例檔案 會員限定

發表迴響