جاوا اسکرپٹ میں ایونٹس کو کیسے منسوخ کریں؟

ویب صفحہ یا ویب سائٹ کو اپ ڈیٹ کرتے وقت، ایسے حالات ہوتے ہیں جہاں کچھ شامل لنکس کی مزید ضرورت نہیں رہتی یا غیر متعلقہ ہو جاتے ہیں۔ اس کے علاوہ، کسی مخصوص ویب سائٹ کے ٹریفک کا مؤثر طریقے سے انتظام کرنا۔ ایسے معاملات میں، JavaScript میں واقعات کو منسوخ کرنا کچھ فعالیت کو غیر فعال کرنے اور اس طرح کے کیس کے منظرناموں کو سنبھالنے میں حیرت انگیز ہے۔

جاوا اسکرپٹ میں ایونٹس کو کیسے منسوخ کریں؟

JavaScript میں واقعات کو منسوخ کرنے کے لیے درج ذیل طریقوں کو استعمال کیا جا سکتا ہے:

- ' روکیں ڈیفالٹ() 'طریقہ.
- ' بولین ویلیو ' نقطہ نظر.
- ' پروپیگنڈے کو روکنا () 'طریقہ.

نقطہ نظر 1: جاوا اسکرپٹ میں ایونٹس کو روکیں ڈیفالٹ () طریقہ استعمال کرتے ہوئے منسوخ کریں۔

' روکیں ڈیفالٹ() ' طریقہ منسلک ایونٹ کو منسوخ کر دیتا ہے اگر یہ منسوخ کرنے کے قابل ہے۔ اس طریقہ کو منسلک واقعہ کو رسائی شدہ لنک سے الگ کرنے کے لیے استعمال کیا جا سکتا ہے اس طرح کارروائی کو انجام دینے سے روکا جا سکتا ہے۔

نحو

event.preventDefault ( )

دیئے گئے نحو میں:

- ' تقریب ” سے مراد اس واقعہ سے الگ ہونا ہے۔

مثال

ذیل میں دیے گئے کوڈ کے ٹکڑوں کو دیکھیں:

< h3 > کلک ایونٹ منسوخ کر دیا جائے گا۔ ! h3 >
< a آئی ڈی = 'سائٹ' href = 'https://www.google.com/' > گوگل ویب سائٹ ملاحظہ کریں۔ a >
document.getElementById ( 'سائٹ' ) .addEventListener ( 'کلک کریں' , فنکشن ( منسوخ ) {
cancel.preventDefault ( ) ;
} ) ;

ذیل میں بیان کردہ اقدامات پر عمل کریں:

- سب سے پہلے، دستاویز آبجیکٹ ماڈل (DOM) پر ظاہر ہونے والی بیان کردہ سرخی شامل کریں۔
- اس کے بعد، وضاحت کریں ' URL ' کا استعمال کرتے ہوئے ' href ' وصف.
- اب، کوڈ کے جاوا اسکرپٹ حصے میں، مخصوص URL تک رسائی حاصل کریں۔
- اس کے علاوہ، ایک منسلک کریں ' کلک کریں 'یو آر ایل کے ساتھ ایونٹ کا استعمال کرتے ہوئے ایک فنکشن کی مدد سے' AddEventListener() 'طریقہ.
- آخر میں، ' روکیں ڈیفالٹ() منسلک ایونٹ کو الگ کرنے کے لیے فنکشن کے پیرامیٹر کی مدد سے طریقہ استعمال کیا جائے گا۔

آؤٹ پٹ

نقطہ نظر 2: بولین ویلیو واپس کرکے جاوا اسکرپٹ میں ایونٹس کو منسوخ کریں۔

اس نقطہ نظر کو واپس کر کے لاگو کیا جا سکتا ہے ' جھوٹا ٹرگرڈ ایونٹ پر بولین ویلیو۔

مثال

کوڈ کی درج ذیل لائنیں بیان کردہ تصور کو ظاہر کرتی ہیں:

< مرکز >< ان پٹ قسم = 'متن' پلیس ہولڈر = 'متن درج کریں' آن پٹ = 'cancelEvent()' >> مرکز >
فنکشن تقریب منسوخ کریں۔ ( ) {
واپسی جھوٹا ;
الرٹ ( 'یہ بیان ظاہر نہیں کیا جائے گا' )
}

مندرجہ بالا کوڈ کے ٹکڑوں میں:

- سب سے پہلے، اندر ' <مرکز> ٹیگ، ایک ان پٹ ٹیکسٹ فیلڈ مختص کریں۔
- اس کے علاوہ، ایک ' آن پٹ 'مخصوص کے ساتھ واقعہ' پلیس ہولڈر ' قدر. اس کے نتیجے میں متن داخل کرنے پر مخصوص فنکشن کو شروع کیا جائے گا۔
- اب، کوڈ کے جاوا اسکرپٹ حصے میں، ایک فنکشن کا اعلان کریں جس کا نام ہے ' CancelEvent() ' اس کی تعریف میں، بولین ویلیو واپس کریں ' جھوٹا 'شامل کو منسوخ کرنے کے لئے' تقریب '
- آخر میں، الرٹ باکس میں بیان کردہ پیغام کی وضاحت کریں۔ لوٹائی گئی بولین ویلیو کے نتیجے میں ڈائیلاگ باکس کو ظاہر کرنے سے گریز کیا جائے گا۔

آؤٹ پٹ

مندرجہ بالا آؤٹ پٹ میں، یہ دیکھا جا سکتا ہے کہ رسائی شدہ فنکشن پر، الرٹ ڈائیلاگ باکس ظاہر نہیں ہوتا ہے جس سے منسلک واقعہ منسوخ ہو جاتا ہے۔

طریقہ 3: stopPropagation() طریقہ استعمال کرتے ہوئے JavaScript میں واقعات کو منسوخ کریں۔

' پروپیگنڈے کو روکنا () ” طریقہ ایک ہی واقعہ کو پھیلانے سے روکتا ہے۔ یہ طریقہ چیک باکس کو چیک کرنے پر دو divs کے درمیان پھیلاؤ کو روکنے کے لیے استعمال کیا جا سکتا ہے۔

نحو

event.stopPropagation ( )

مثال

کوڈ کی درج ذیل لائنوں کا مشاہدہ کریں:

< مرکز >< h3 > تبدیلی کا مشاہدہ کرنے کے لیے ویب سائٹ پر کلک کریں: h3 >
< div کلک پر = عنصر 2() > لینکس
< div کلک پر = عنصر 1 (واقعہ) > ویب سائٹ div >
div >
< بی آر >
پھیلاؤ کو روکنے کے لیے چیک کریں:
< ان پٹ قسم = 'چیک باکس' آئی ڈی = 'چیک' >
مرکز >

- پہلے مرحلے میں، اسی طرح، بیان کردہ سرخی شامل کریں۔
- اب، دو شامل کریں ' div 'منسلک کے ساتھ ٹیگز' کلک پر ان میں سے ہر ایک کے ساتھ دو مختلف افعال عنصر 2 () اور عنصر 1 () کو شامل کرنے والے واقعات۔
- اس کے علاوہ، مخصوص آئی ڈی کے ساتھ ایک چیک باکس بھی شامل کریں۔ اس چیک باکس کے نتیجے میں دو divs کے درمیان پھیلاؤ کو روکا جائے گا۔

اب، کوڈ کی درج ذیل جاوا اسکرپٹ لائنوں کو دیکھیں:

فنکشن عنصر 1 ( اور ) {
الرٹ ( 'آپ نے ویب سائٹ پر کلک کیا' ) ;
اگر ( document.getElementById ( 'چیک' ) چیک کیا ) {
e.Stop Propagation ( ) ;
}
}
فنکشن عنصر 2 ( ) {
الرٹ ( 'آپ نے لینکس ہینٹ پر کلک کیا' ) ;
}

مذکورہ جے ایس کوڈ میں:

- ایک فنکشن کی وضاحت کریں جس کا نام ' عنصر1() ' یہاں، پیرامیٹر ' اور 'سے مراد ہے' تقریب کوڈ کے ایچ ٹی ایم ایل حصے میں برطرف کیا جا رہا ہے۔
- اس کی تعریف میں، بیان کردہ پیغام کے ساتھ الرٹ ڈائیلاگ باکس دکھائیں۔
- اس کے بعد، 'کا استعمال کرتے ہوئے اس کی آئی ڈی کے ذریعہ بنائے گئے چیک باکس تک رسائی حاصل کریں۔ getElementById() 'طریقہ. اس کے علاوہ، لاگو کریں ' چیک کیا چیک شدہ چیک باکس کی حالت کو چیک کرنے کے لیے اس کی جائیداد۔
- پھر، لاگو کریں ' پروپیگنڈے کو روکنا () 'پیرامیٹر کا حوالہ دینے والا طریقہ' اور ' اس کے نتیجے میں ایک فنکشن سے دوسرے فنکشن میں پھیلاؤ کو روکا جائے گا۔
- اسی طرح، ایک اور فنکشن کی وضاحت کریں ' عنصر2() پروپیگنڈہ کیا جائے۔ یہ فنکشن صرف تبلیغ سے پہلے ہی کام کرے گا۔

آؤٹ پٹ

یہاں، چیک باکس کو چیک کرنے پر div پر کلک کرنے پر رویے کا مشاہدہ کرتا ہے۔

ہم نے جاوا اسکرپٹ میں واقعات کو منسوخ کرنے کے طریقوں کو مرتب کیا ہے۔

نتیجہ

' روکیں ڈیفالٹ() 'طریقہ،' بولین قدر نقطہ نظر، یا پروپیگنڈہ بند کرو () ” طریقہ جاوا اسکرپٹ میں واقعات کو منسوخ کرنے کے لیے استعمال کیا جا سکتا ہے۔ پہلا طریقہ منسلک ایونٹ کو الگ کرنے کے لیے لاگو کیا جا سکتا ہے جس کے نتیجے میں لنک کو غیر فعال کر دیا جاتا ہے۔ بولین ویلیو اپروچ واپس کرتا ہے ' جھوٹا ٹرگرڈ ایونٹ پر بولین ویلیو۔ stopPropagation() طریقہ کو شامل چیک باکس کی مدد سے دو divs کے درمیان پھیلاؤ کو روکنے کے لیے لاگو کیا جا سکتا ہے۔ اس ٹیوٹوریل میں جاوا اسکرپٹ میں واقعات کو منسوخ کرنے کی وضاحت کی گئی ہے۔

جاوا اسکرپٹ میں ایونٹس کو کیسے منسوخ کریں؟