jQuery හි බලපෑම අවසන් වීමෙන් පසු ක්‍රියාව

සමහරවිට ඔබට බලපෑමක් අවසන් වීමෙන් පසු යම් ක්‍රියාවක් සිදු කිරීමට අවශ්‍ය විය හැකිය. උදාහරණයක් ලෙස, බොත්තමක් මත ක්ලික් කිරීමෙන් යම් බ්ලොක් එකක් සුමටව සැඟවිය යුතු අතර, එය සම්පූර්ණයෙන් සැඟවුණු පසුව පමණක් තිරය මත යමක් ප්‍රදර්ශනය කළ යුතුය.

කේත පේළි එකින් එක ලිවීමට නම් - මූලද්‍රව්‍යය සැඟවීමට තවමත් අවසාන වී නැත, ඊළඟ කේත පේළිය ක්‍රියාත්මක වීමට පටන් ගනී - එවිට අපට අවශ්‍ය දෙය ලැබෙන්නේ නැත. බොත්තම මත ක්ලික් කරන්න - මූලද්‍රව්‍යය සැඟවීමට පටන් ගනීවි, එය ක්‍රියාත්මක වීමට පටන් ගනීවි.

පහත උදාහරණය බලන්න. අපට පහත HTML කේතය ඇතැයි සිතන්න:

<button id="hide">සඟවන්න</button>
<div id="elem">text...</div>

මෙම කේතය සඳහා CSS පහත පරිදි ලියා ඇත:

#elem {
	padding: 10px;
	width: 150px;
	height: 150px;
	border: 1px solid green;
	margin-top: 10px;
}

Javascript කේතය පහත පරිදි දිස්වේ:

$('#hide').click(function() {
	$('#elem').hide(1000);
	$('#hide').html('සැඟවුණු');
});

එවැනි ගැටළු වළක්වා ගැනීම සඳහා, සජීවීකරණය සහ බලපෑම් සමඟ වැඩ කිරීම සඳහා ඇති සියලු ක්‍රමවල එවැනි විකල්ප පරාමිතියක් ඇත, අපට එයට callback-ශ්‍රිතයක් සම්පොදු කළ හැකිය, එය සජීවීකරණය අවසන් වීමෙන් පසු ක්‍රියාත්මක වේ. අපගේ අවස්ථාවේ දී, අපි callback-ශ්‍රිතය hide ක්‍රමයට සම්පොදු කළා, එම ශ්‍රිතයේ ශරීරය තුළ බොත්තමේ නම වෙනස් කළා:

$('#hide').click(function() {
	$('#elem').hide(1000, function() {
		$('#hide').html('සැඟවුණු');
	});
});