گروه آموزش طراحی سایت 19 خرداد 1392 1 956 بازدید آموزش HTML

در سلسله آموزشهای طراحی سایت آنلاینر به بخش دوم Event attribute در html پرداختیم.

در این مقاله قصد بررسی بخش سوم Event attribute در html  را داریم.

صفات رویداد های فرمی Form Events

onblur : اسکریپت ها هنگامی که عامل مورد نظر فوکوس را از دست بدهد اجرا میشود.
onchange : در زمانیکه مقدار عامل مورد نظر تغییر کند اسکریپت اجرا میشود.
onfocus : اسکریپت ها هنگامی که روی عامل مورد نظر فوکوس شود اجرا میشود.
onformchange : این رویداد زمانی اتفاق می افتد که فرم تغییر کند.
onforminput : این رویداد نیز هنگامی که کاربر مقداری را در یکی از عامل های درون فرم وارد کند اتفاق می افتد.
oninput :هنگامی که عامل از کاربر مقداری را دریافت کند اسکریپت اجرا خواهد شد.
oninvalid :اسکریپت هنگامی که مقدار اشتباه وارد شود اجرا خواهد شد.
onreset : این رویداد زمانی اجرا خواهد شد که دکمه reset در فرم کلیک شود. نکته این رویداد در html5 پشتیبانی نمیشود.
onselect : زمانی که متنی در عامل مورد نظر انتخاب شود اسکریپت اجرا خواهد شد.
onsubmit : در این رویداد هنگامی که دکمه submit در فرم کلیک شود اجرا خواهد شد.

رویداد های فرمی در صفحات وب کاربرد بسیار زیادی دارند به طوری که جذابیت و رفاه کاربر را در صفحه به طور چشمگیری افزایش می دهد.

در زیر مثالی از رویداد onfocus را میتوانید مشاهده کنید. سعی کنید این مثال را حتما در سیستم خود تست کنید. با درک این مثال حتما دیگر رویداد ها را به سادگی و بدون خطا میتوانید در صفحه وب خود به کار گیرید.

<!DOCTYPE html>
<html>
<head>
<script>
function setStyle(x)
{
document.getElementById(x).style.background="yellow";
}
</script>
</head>
<body>

<p>در تابعی که در این مثال نوشته شده است با گرفتن فوکوس یکی از فیلد های ورودی ، رنگ زمینه آن تغییر پیدا میکند.</p>
First name: <input type="text" id="fname" onfocus="setStyle(this.id)"><br>
Last name: <input type="text" id="lname" onfocus="setStyle(this.id)">

</body>
</html>

در آموزش بعد بخش چهارم  Event attribute میپردازیم.

با آنلاینر همراه شوید …