پنج‌شنبه ۱ آذر ۱۴۰۳ |  عضویت / ورود






[ بخش اصلی آموزشها | افزودن آموزش | داری بیشترین امتیاز | دارای بیشترین بیننده | جدیدترین نظرات ]

قطعه کد جاوا اسکریپت برای جدا کردن سه رقم اعداد با کاما


Sunday, 2011 December 11   نویسنده: Hamid   تعداد بازدید: 16412 بار  #آموزش جاوا اسکریپت - Java Script‏   امتیاز متوسط: امتیازی داده نشده است

در فرم‌های تحت وب، وقتی کاربر عددی مثل 2000000 را در یک فیلد مثل فیلد قیمت وارد می‌کند، ممکن است گیج شود و نداند دقیقاً چند صفر وارد کرده. اما اگر شما عدد را به صورت 2,000,000 به او نمایش دهید و در حین تایپ، کاماها را خودتان بیافزایید، این مشکل رفع می‌شود.

برای این کار، یک قطعه کد کامل و عالی برایتان آماده کرده‌ایم.

1- ابتدا فایل زیر را با کلیک راست روی لینک و انتخاب save Target As ذخیره کنید:

http://tutorials.aftab.cc/web/javascript/number_format/NumberFormat.js

 

2- با قطعه کد زیر، این فایل را به صفحه خود ضمیمه کنید:

<script type="text/javascript" src="js/NumberFormat.js"></script>

(تصور ما این این است که شما این فایل را در پوشه js در کنار فایلی که در حال طراحی هستید، قرار داده‌اید)

3- در کنار فیلد مربوط به قیمت، یک input از نوع readonly و یا حتی disabled قرار دهید:

قطعه کد فیلد قیمت و قیلدی که قیمت همراه با کاما را نشان می‌دهد به صورت زیر است:

<input type="text" name="price" id="price" onkeyup="javascript:FormatNumber('price','price2');" />
<input type="text" id="price2" disabled="disabled" />

به تابع FormatNumber دقت کنید.

این تابع دو ورودی دارد. اولی فیلدی است که عدد را کاربر در آن وارد می‌کند و دومی فیلدی است که نتیجه عدد همراه با کاما در آن قرار می‌گیرد.

 

توجه:

- این تابع اعداد اعشاری را نیز به خوبی تشخیص داده و صحیح و همراه با کاما نمایش می‌دهد.

- به idها دقت کنید.

 

موفق باشید؛
حمید رضا نیرومند


.



ارسال سؤال یا نظر


1- علی رحمانی:
بوسیله: , در: Wednesday, 2012 June 13-کد: 4438
با سلام
ممنون از اینکه سورس کد را گذاشتید
عالی بود


2- آشنا:
بوسیله: , در: Monday, 2012 October 15-کد: 5084
خودت این تابع رو تست کردی دوست عزیز؟؟

اصلا تابع numberformat توی فایل js نیست


3- اسماعیل:
بوسیله: , در: Wednesday, 2020 October 14-کد: 16439
عالی بود خیلی دنبالش گشتمrnلطفا مطالب بیشتری برای اموزش بزارید

Tutorials ©