是否有時會苦腦怎樣顯示金錢格式才能讓使用者一目了然呢?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> |