jquery проверяет наличие символа после содержимого элемента

#jquery #regex #string

#jquery #регулярное выражение #строка

Вопрос:

У меня есть это:

 <div class="people">
 <a class="deleteUser"> x </a> <a class="userLink"> John Malkovich </a> , 
 <a class="deleteUser"> x </a> <a class="userLink"> Adrian Mutu </a>
</div>

При нажатии на ссылки «deleteUser» я хочу иметь возможность :

-скрыть ту же ссылку

-удалите относительную ссылку «Пользовательская ссылка»

-и только если после ссылки «Пользовательская ссылка» возникает кома, устраните ее (вот тут мне нужна помощь!)

Как мне проверить с помощью jquery, есть ли кома после содержимого элемента?

Спасибо

Luca

Ответ №1:

Попробуйте это :

 $(".deleteUser").click(function() {
    var index = ($(this).index() 1)/2;
    $(".people").contents().filter(function() {
        return this.nodeType == 3 amp;amp; $.trim($(this).text()) == ",";
    }).eq(index).remove();
    $(this).next(".userLink").remove().end().remove();
});

Смотрите jsFiddle

1. @luka снова видит jsFiddle ( jsfiddle.net/gubhaju/hCZKb/5 ): является полным решением.

2. @Prakash, если убрать <a/> из середины, запятая в конце останется. var a = $(this).index()/2; и .eq(a - 1) должен позаботиться о проблеме.

3. Спасибо и 1 за осведомленность, иногда выполняя что-то быстрее, можно пропустить такие вещи 🙂

4. @Prakash не могли бы вы объяснить, что означает «remove().end().remove()» и почему недостаточно «remove()»?

5. remove() сначала удаляет объект a с классом ‘UserLink’, затем переходит end() обратно к первому селектору $(this) , который является узлом с классом ‘deleteUser’, затем delete() fxn удаляет его.

Ответ №2:

Учитывая вашу исходную разметку, вы можете использовать .contents() и .filter() для поиска последнего текстового узла, который является ,

Небольшое обновление, исправляющее проблему с запятой в середине и удаляющее запятую в конце.

 $(".deleteUser").click(function() {
    var a = $(this).index()/2;
    $(this).next(".userLink").remove().end().remove();
    $(".people").contents().filter(function() {
        return this.nodeType == 3 amp;amp; $.trim($(this).text()) == ",";
    }).eq(a - 1).remove();
});

Примечание: Если вы можете настроить разметку для переноса элементов в другой элемент, это будет проще выполнить.

Пример кода на jsfiddle.

Ответ №3:

Я бы разместил оба <a> тега внутри контейнера:

 <div class="people">
 <div class='person' id='person1_container'><a class="deleteUser"> x </a> <a class="userLink">John Malkovich</a>,</div>
 <div class='person' id='person1_container'><a class="deleteUser"> x </a> <a class="userLink"> Adrian Mutu </a></div>
</div>

Затем вы можете спрятать весь контейнер целиком:

 <div class="people">
 <div class='person' id='person1_container'><a class="deleteUser" onclick="document.getElementById('person1_container').style.display = 'none';"> x </a> <a class="userLink">John Malkovich</a>,</div>
 <div class='person' id='person2_container'><a class="deleteUser" onclick="document.getElementById('person2_container').style.display = 'none';"> x </a> <a class="userLink"> Adrian Mutu </a></div>
</div>

Ответ №4:

Я бы реструктурировал ваши данные:

 <div class="people">
    <div class="user"><a class="delete"> x </a> John Malkovitch,</div>
    <div class="user"><a class="delete"> x </a> Adrian Mutu</div>
</div>

Тогда у вас может быть просто некоторый код, который удаляет весь div.user:

 $('div.people div.user a.delete').click(function(evt) {
    $(evt.target).closest('div.user').hide();
});