معرفی
در این مقاله با رویدادهای جاوا اسکریپت آشنا می شویم. یک رویداد چیز خاصی نیست، فقط انجام یک کار خاص در مرورگر. زمانی که کاربر روی دکمه ای کلیک می کند، این اتفاق می افتد. انواع مختلفی از رویدادها در جاوا اسکریپت وجود دارد. ما در مقاله قبلی برخی از وقایع را توضیح دادیم. در این مقاله شاهد برخی رویدادهای دیگر در جاوا اسکریپت خواهیم بود.
تعریف رویداد
رویدادها اقداماتی هستند که توسط جاوا اسکریپت قابل شناسایی هستند. با استفاده از جاوا اسکریپت، ما توانایی ایجاد رابط های پویا برای صفحات وب را داریم. رویدادها در ترکیب با توابع استفاده می شوند.
بیایید رویدادهای جاوا اسکریپت را ببینیم:
رویداد را انتخاب کنید
رویداد Onerror
رویداد Onresize
رویداد Onblur
رویداد متمرکز
رویداد را انتخاب کنید
رویداد onselect پس از انتخاب متنی در یک عنصر رخ می دهد. Onselect را می توان در موارد زیر استفاده کرد:
. این برای کپی یا انتخاب متن جعبه ورودی استفاده می شود.
نحو
در نحو HTML:
در نحو جاوا اسکریپت:
object.onselect = "Some code"
مثال
این مثال رویداد onselect جاوا اسکریپت را نشان می دهد:
"utf-8">
Onselect Event in JavaScript
Enter User Name:
"text" name="fname" onselect="textselect()">
Enter Password:
"password" name="pwd">
"text/javascript">
function textselect() {
alert("Some text must not be selected");
}
خروجی
در اینجا خروجی مثال رویداد onselect نشان داده شده در بالا است:
رویدادها در جاوا اسکریپت
رویداد Onerror
اگر هنگام بارگیری یک فایل خارجی (مثلاً سند یا تصویر) خطایی رخ دهد، رویداد onerror فعال می شود. اگر هنگام رسیدن پیغام خطا، تصویر بارگذاری نشود، خطا برمی گردد. اگر خطا دریافت نشد، تصویر به درستی بارگذاری شده است.
نحو
در نحو HTML:
در نحو جاوا اسکریپت:
object.onerror = "Some code"
مثال
این مثال یک رویداد یک خطای جاوا اسکریپت را نشان می دهد:
"utf-8">
Onerror Evenet in JavaScript
"text/javascript">
function myerror() {
alert("image unable to load");
alert("image resource not found");
}
"html.jpg" width="200px" height="200px" onerror="myerror()" alt="sorry image resource are not found">
خروجی
در اینجا خروجی مثال رویداد onerror ارائه شده در بالا است:
رویدادها در جاوا اسکریپت
رویداد Onresize
رویداد onresize زمانی رخ می دهد که اندازه یک عنصر تغییر کند.
نحو
در نحو HTML:
در نحو جاوا اسکریپت:
object.onresize = "Some code"
مثال
این مثال یک رویداد onresize جاوا اسکریپت را نشان می دهد:
"utf-8">
"pageresize()">
Onresize event in JavaScript
Resize the page and check the alert message….
one resized warning displayed successfully.
"text/javascript">
function pageresize() {
alert("Sorry page unable to resize");
}
خروجی
در اینجا خروجی مثال رویداد onresize نشان داده شده در بالا است:
رویدادها در جاوا اسکریپت
رویداد Onblur
روشن شدن زمانی رخ می دهد که یک شی تمرکز خود را از دست بدهد. Onblur اغلب با کد اعتبار سنجی فرم (زمانی که کاربر یک فیلد فرم را ترک می کند) استفاده می شود.
توجه داشته باشید
رویداد onblur برعکس رویداد onfocus است.
نحو
در نحو HTML:
در نحو جاوا اسکریپت:
object.onblur = "Some code"
مثال
این مثال رویداد onblur جاوا اسکریپت را نشان می دهد:
Onblur event in JavaScript
Enter the Name in Lowercase:
"text" id="fname" onblur="uppercase()">
Enter the Name in Uppercase:
"text" id="lname" onblur="lowercase()">
"text/javascript">
function uppercase() {
var x=document.getElementById("fname");
x.value=x.value.toUpperCase();
}
function lowercase() {
var x=document.getElementById("lname");
x.value=x.value.toLowerCase();
}
خروجی
در اینجا خروجی مثال رویداد onblur نشان داده شده در بالا است:
رویدادها در جاوا اسکریپت
رویداد Onfocus
رویداد onfocus زمانی اتفاق میافتد که یک عنصر فوکوس شود. رویداد onfocus برعکس رویداد onblur است.
نحو
در نحو HTML:
در نحو جاوا اسکریپت:
object.onfocus = "Some code"
مثال
این مثال رویداد onfocus جاوا اسکریپت را نشان می دهد:
Onfocus event in JavaScript
"text/javascript">
function onfcs(x) {
x.style.color="white";
x.style.backgroundColor="green";
}
//onfocus event is the opposite of the onblur event
function onblr(x) {
x.style.color="green";
x.style.backgroundColor="white";
}
"text" onfocus="onfcs(this)" onblur="onblr(this)">
خروجی
در اینجا خروجی مثال رویداد onfocus نشان داده شده در بالا است:
رویدادها در جاوا اسکریپت
نتیجه
در این مقاله، شاهد چند رویداد دیگر در جاوا اسکریپت بودیم. امیدوارم این مقاله برای شما مفید باشد. با تشکر برای خواندن!
ویرایش کنید