jQuery обрезать и удалить родительские прерывания дочерних событий

Question

Примечание: У меня есть обходной путь к этой проблеме, но я бы предпочел, чтобы запятая разделила значения, как я опишу ниже, а не разделяю их с пробелами (это то, что мое обходное решение делает).

У меня есть сайт ASP.NET, который позволяет преподавателям выбирать из списка DropDownList из предустановленных комментариев и применять эти комментарии для учащихся в своих классах. Я показываю учеников и комментарии внутри GridView и использую Label для отображения любых комментариев, которые уже существуют в базе данных (удаляя их из DropDownList в процессе). Когда инструктор выбирает один из этих комментариев и нажимает на кнопку, моя функция JQuery:

1. Тянет выбранное значение и текст из варианта (при условии, что это не по умолчанию).
2. Проверяет длину метки Label.children() и добавляет «,» к тексту, если он больше нуля.
3. Создает тэг <span> со скрытым полем, содержащим значение и текст.
4. Добавляет текст внутри пролета.
5. Закрывает пролет.
6. Прикрепляет событие onclick к проему.
7. Удаляет исходный вариант из списка DropDownList.

Событие onclick тега span делает обратное тому, что я опишу выше, - оно вытягивает значение и текст и заново создает параметр в раскрывающемся меню. Кроме того, он заменяет строки, такие как «,», «» в родительской метке. Я обнаружил, что когда я заменяю эти строки (которые лежат вне промежутков, на которые я привязывал события onclick), события onclick исчезают.

Я знаком с .live(), но поскольку каждая строка в этом GridView содержит уникальную ссылку на конкретный учащийся и класс, используемые в данный момент, я не могу знать значения, которые каждая строка должна передавать в funciton раньше времени. Есть ли какое-либо решение этой проблемы, кроме описанного выше, или повторного присоединения события onclick?

Answer 1

Вот эта идея: Закрой запятые в <span> s с некоторым классом, как «разделитель». Затем, когда вы удаляете элемент, вы можете проверить, является ли это первым в списке, и если да, удалите последующий разделитель, а если нет, удалите предыдущий. Таким образом, мы будем говорить, у вас есть HTML-структура, как так:

<span id="myLabel"> 
    <span class="comment">You're great!</span><span class="separator">, </span><span class="comment">You're mediocre!</span><span class="separator">, </span><span class="comment">You suck!</span> 
</span> 

Вот функция клик, который должен удалить запятые правильно, сохраняя при этом OnClick события:

$('.comment').click(function() { 
    //decide which comma to remove 
    if ($(this).prevAll('.comment').size() == 0) { 
     //this is the first comment, remove the next comma and this comment 
     $(this).next('.separator').remove().end().remove(); 
    } else { 
     //this is not the first comment, remove the previous comma and this comment 
     $(this).prev('.separator').remove().end().remove(); 
    } 
}); 

Вот демо, показывающий, что это работает: http://jsfiddle.net/yWet5/

Извините, если я не понял какую-либо часть вашей проблемы.