Redaktimi dhe Fshirja e Njëkohshme e Elementeve

Le të themi se kemi një grup të caktuar paragrafësh:

<div id="parent">
	<p>text1</p>
	<p>text2</p>
	<p>text3</p>
</div>

Le t'i bëjmë këto paragrafe të tilla që teksti i çdo paragrafi të mund të redaktohet dhe në fund të çdo paragrafi të ketë një lidhje për fshirje.

Gjatë implementimit të detyrës së përshkruar na pret një problem i caktuar.

Për të kuptuar thelbin e problemit, le të shohim kodin HTML që do të fitohet, kur në fund të çdo paragrafi do të shtohen lidhjet për fshirje:

<div id="parent">
	<p>text1<a href="">remove</a></p>
	<p>text2<a href="">remove</a></p>
	<p>text3<a href="">remove</a></p>
</div>

Le të imagjinojmë tani, që me një klikim në çdo paragraf, në të do të shfaqet një input për redaktim të tekstit. Në këtë rast, në input do të hyjë i gjithë teksti i paragrafit - së bashku me lidhjen për fshirje!

Kjo, sigurisht, nuk është e saktë.

Një zgjidhje më e suksesshme do të ishte mbështjellja e teksteve të paragrafëve në etiketat span, kështu:

<div id="parent">
	<p><span>text1</span><a href="">remove</a></p>
	<p><span>text2</span><a href="">remove</a></p>
	<p><span>text3</span><a href="">remove</a></p>
</div>

Për një kod të tillë thjesht mund të vendosni një ngjarje për redaktim jo në vetë paragrafin, por në span me tekst. Në këtë rast, input-i për redaktim do të shfaqet brenda etiketës span, dhe lidhja jonë për fshirje do të mbetet e paprekur.

Është dhënë kodi HTML vijues:

<div id="parent">
	<p><span>text1</span></p>
	<p><span>text2</span></p>
	<p><span>text3</span></p>
</div>

Shtoni një lidhje për fshirje në fund të çdo paragrafi.

Bëni që me një klikim në span të shfaqet një input për redaktim brenda tij.

Le të themi tani që fillimisht nuk ka etiketa span:

<div id="parent">
	<p>text1</p>
	<p>text2</p>
	<p>text3</p>
</div>

Fillimisht mbështillni tekstin e paragrafit në etiketat span, shtoni këtyre etiketave mundësinë e redaktimit, dhe pastaj shtoni në fund të çdo paragrafi një lidhje për fshirje.