Jquery добавить две HTML-страницы с различными классами

0

Привет, я запутался с функцией.append() и .html() jquery.

У меня это внутри AJAX sucess:

success: function(response){

$('#imodal').html('Success!').addClass("flash-success").fadeIn();

$('#imodal').append(response);

}

это будет в основном показывать своего рода флэш-сообщение на зеленом фоне с классом "flash-success" и ответ от кодировки JSON, который содержит необходимую информацию о транзакции, которая только что произошла.

Моя проблема заключается в том, что класс "flash-success" также присутствует в добавленном ответе. Как сделать классы этих двух разных? Я попробовал это:

$('#imodal').html('Success!').addClass("flash-success").fadeIn();

$('#imodal').append(response).removeClass("flash-success");

но не повезло. Приложенный ответ по-прежнему остается зеленым, возможно, обладающим классом "flash-success". Спасибо за помощь!

  • 0
    Вы добавляете в контейнер. У контаины есть класс. Этот класс будет влиять на добавляемый контент. Где путаница?
Теги:
class
append

4 ответа

1
Лучший ответ

jQuery append() будет вставлять содержимое/элемент в конец контейнера без замены его содержимого. http://api.jquery.com/append/

Где jQuery html() перезапишет содержимое внутри контейнера с предоставлением данных и с форматированием html http://api.jquery.com/html/

My problem is, the class "flash-success" is also present in the appended response

Потому что вы добавляете класс к append самому html('Success!').addClass("flash-success")

Пытаться:

$('#imodal').append(response); // Append the child to element
$('#imodal').addClass("flash-success"); // add class to container
Поделиться
  • 0
    Добавление или вставка новых данных не изменит класс контейнера, если вы не запрограммировали их изменить.
  • 0
    первый html должен иметь класс, а добавленный не должен. Как мне это сделать?
Показать ещё 2 комментария
1

$('#imodal').append(response).removeClass("flash-success"); Это не удаляет класс из добавленного ответа, он будет искать класс в элементе #imodal которого нет. Если ваш ответ html-код, вы должны сделать что-то вроде этого: $(response).removeClass("flash-success");

Поделиться
1

Метод jQuery.append() добавит содержимое в конец элемента. В вашем случае "элемент ответа" будет добавлен в элемент DOM с идентификатором "imodal".

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

Поделиться
0

просто вам нужно добавить класс "flash-success" после добавления вашего ответа

$("#imodal").append(response)
$("#imodal").addClass("flash-success")

вы можете получить желаемый result----

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню