Kitendo Baada ya Mwisho wa Athari katika jQuery

Wakati mwingine huenda ukahitaji kutekeleza kitendo fulani baada ya mwisho wa athari. Kwa mfano, kwa kubonyeza kitufe kizuizi fulani kifichike kwa utulivu na tu baada ya kufichika kabisa, ndipo hitaji la kukitokeza kwenye skrini.

Ikiwa utaandika mistari ya msimbo moja baada ya nyingine - kipengele bado hakitakuwa kimefichika, wakati mstari unaofuata wa msimbo utaanza kutekelezwa - na hatutapata tulichotaka. Bonyeza kitufe - kipengele kitaanza kujificha na mara moja maandishi ya kitufe yatabadilika.

Angalia mfano ufuatao. Hebu tuseme tuna msimbo ufuatayo wa HTML:

<button id="hide">ficha</button>
<div id="elem">maandishi...</div>

Kwa msimbo huu kimeandikwa CSS:

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

Msimbo wa Javascript unaonekana hivi:

$('#hide').click(function() {
	$('#elem').hide(1000);
	$('#hide').html('imefichika');
});

Ili kuepuka matatizo kama haya, katika njia zote za kufanya kazi na uhuishaji na athari zimeandaliwa kigezo kisichohitajika, ambacho tunaweza kupitisha kitendakazi-callback, ambacho kitatekelezwa baada ya uhuishaji kumalizika. Katika kesi yetu, tulipitisha kitendakazi-callback kwenye njia hide, na tayari ndani ya mwili wa kitendakazi hicho tulibadilisha jina la kitufe:

$('#hide').click(function() {
	$('#elem').hide(1000, function() {
		$('#hide').html('imefichika');
	});
});