Адначасове рэдагаванне і выдаленне элементаў
Няхай у нас ёсць нейкі набор абзацаў:
<div id="parent">
<p>text1</p>
<p>text2</p>
<p>text3</p>
</div>
Давайце для гэтых абзацаў зробім так, каб можна было рэдагаваць тэкст кожнага абзаца і пры гэтым у канцы кожнага абзаца стаяла спасылка на выдаленне.
Пры рэалізацыі апісанай задачы нас чакае нейкая праблема.
Для таго, каб зразумець сутнасць праблемы, давайце паглядзім на HTML код, які атрымаецца, калі ў канец кожнага абзаца будуць дададзены спасылкі на выдаленне:
<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>
Уявім цяпер, што па кліку на любы абзац у ім з'явіцца інпут для рэдагавання тэксту. У гэтым выпадку ў інпут будзе трапляць ўвесь тэкст абзаца - разам са спасылкай на выдаленне!
Гэта, вядома ж, не правільна.
Больш удалым рашэннем будзе абгарнуць тэксты
абзацаў у тэгі span, вось так:
<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>
Для такога кода можна проста навесіць здарэнне
для рэдагавання не на сам абзац, а на
span з тэкстам. У гэтым выпадку інпут
для рэдагавання з'явіцца ў тэгу
span, і наша спасылка для выдалення застанецца
некранутай.
Дадзены наступны HTML код:
<div id="parent">
<p><span>text1</span></p>
<p><span>text2</span></p>
<p><span>text3</span></p>
</div>
Дадайце спасылку на выдаленне ў канец кожнага абзаца.
Зрабіце так, каб па кліку на span
у ім з'яўляўся інпут для рэдагавання.
Няхай цяпер першапачаткова тэгаў span няма:
<div id="parent">
<p>text1</p>
<p>text2</p>
<p>text3</p>
</div>
Абгарніце спачатку тэкст абзаца ў тэгі span,
дадайце да гэтых тэгаў магчымасць рэдагавання,
а затым дадайце ў канец кожнага абзаца спасылку
на выдаленне.
