کاربران گرامی در این پروژه به شما پروژه کاربردی با جاوا اسکریپت را قرارداده ایم شما عزیزان می توانید از بخش دانلود پروژه کاربردی با جاوااسکریپت سایر پروژه هایی که با جاوا اسکریپت طراحی شده اند را مشاهده و دانلود کنید.
در صورتی که نیاز به آموزش حضوری و یا غیر حضوری این پروژه داشتید میتوانید با ما در ارتباط باشید تا این پروژه را به شما آموزش دهیم حتی میتوانید در صورت دلخواه پروژه را به خواسته شما شخصی سازی کنیم لازم به ذکر است که تیم پروژه در صفحه دانلود پروژه کاربردی پروژه های مختلفی را به زبان های مختلف برنامه نویسی قرار داده است .شماره تماس با پرپروژه 09050394455 می باشد
### تبدیل کننده ارز (Currency Exchanger) با جاوا اسکریپت و کد منبع
در این پروژه، یک **تبدیل کننده ارز** ساده را با استفاده از HTML، CSS و JavaScript پیاده‌سازی می‌کنیم. این برنامه به کاربران امکان می‌دهد تا مبالغ را از یک ارز به ارز دیگر تبدیل کنند.
### 1. **HTML**
ابتدا ساختار HTML را برای تبدیل کننده ارز ایجاد می‌کنیم.
```html
تبدیل کننده ارز
تبدیل کننده ارز
```
### 2. **CSS**
برای طراحی ظاهری تبدیل کننده ارز از CSS استفاده می‌کنیم.
```css
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
.container {
background-color: #fff;
padding: 20px;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
width: 90%;
max-width: 400px;
}
h1 {
text-align: center;
margin-bottom: 20px;
}
.form-container {
display: flex;
flex-direction: column;
}
input, select {
padding: 10px;
margin: 5px 0;
border: 1px solid #ccc;
border-radius: 5px;
}
button {
padding: 10px;
background-color: #28a745;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
}
.result {
margin-top: 20px;
font-size: 18px;
font-weight: bold;
color: #333;
text-align: center;
}
```
### 3. **JavaScript**
سپس منطق تبدیل کننده ارز را با JavaScript پیاده‌سازی می‌کنیم. برای سادگی، از نرخ‌های تبدیل ثابت استفاده می‌کنیم.
```javascript
// نرخ تبدیل ارز (به عنوان مثال)
const exchangeRates = {
USD: 1,
EUR: 0.85,
GBP: 0.75,
IRR: 42000 // نرخ تقریبی ریال به دلار
};
// افزودن رویداد به دکمه تبدیل
document.getElementById('convertBtn').addEventListener('click', convertCurrency);
// تابع تبدیل ارز
function convertCurrency() {
const amount = document.getElementById('amount').value;
const fromCurrency = document.getElementById('fromCurrency').value;
const toCurrency = document.getElementById('toCurrency').value;
// بررسی ورودی‌ها
if (!amount || amount <= 0) {
alert('لطفاً مقدار معتبری وارد کنید.');
return;
}
// محاسبه مقدار تبدیل شده
const amountInUSD = amount / exchangeRates[fromCurrency];
const convertedAmount = amountInUSD * exchangeRates[toCurrency];
// نمایش نتیجه
document.getElementById('result').textContent = `مقدار ${amount} ${fromCurrency} برابر است با ${convertedAmount.toFixed(2)} ${toCurrency}`;
}
```
### توضیحات کد:
1. **HTML**:
- فرم برای دریافت مقدار و انتخاب ارزهای مبدا و مقصد.
- دکمه‌ای برای انجام تبدیل و بخشی برای نمایش نتیجه.
2. **CSS**:
- **طراحی ظاهری**: شامل استایل‌های مناسب برای ایجاد رابط کاربری زیبا و کاربرپسند.
3. **JavaScript**:
- **نرخ تبدیل ارز**: یک شیء شامل نرخ‌های تبدیل برای ارزهای مختلف.
- **عملکرد تبدیل**: با کلیک بر روی دکمه، مقدار ورودی گرفته شده و بر اساس نرخ تبدیل محاسبه و نمایش داده می‌شود.
### نتیجه‌گیری
این پروژه **تبدیل کننده ارز** یک مثال ساده از نحوه کار با JavaScript و دستکاری DOM است. میتوانید این پروژه را با افزودن نرخ‌های تبدیل پویا از یک API یا بهبود رابط کاربری گسترش دهید. از کدنویسی لذت ببرید!
| صفحه قابل مشاهده:
دانلود پروژه کاربردی تبدیل کننده ارز (Currency Exchanger) با جاوا اسکریپت و کد منبع می‌باشد
