Перейти к публикации
View in the app

A better way to browse. Learn more.

Дизайн и модификация Invision Community

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Помогите с логикой замены html + class + text через JS

Опубликовано:

Здравствуйте. Нужно заменить некоторые данные через JS, с кодом мне всё понятно, не понятно с логикой, как лучше сделать.

 

Имеем вот такой HTML код:

 

<span class="ipsBadge ipsBadge_large ipsBadge_pill {{if $game['slots'] - $game['taken'] > 2}}ipsBadge_positive{{elseif $game['slots'] === $game['taken']}}ipsBadge_negative{{else}}ipsBadge_intermediary{{endif}}">
<span data-countTypeTaken='{$game['gamename']}' data-currentCount='{$game['taken']}'>{$game['taken']}</span>/<span data-countTypeSlots='{$game['gamename']}' data-currentCount='{$game['slots']}'>{$game['slots']}</span>
</span>

 

Где: $game['slots'] - сколько всего слотов в игре, $game['taken'] - текущее количество игроков.

 

Обновление текста я написал, с этим проблем нет, т.е:

 

var takenBefore = parseInt(this.scope.find('[data-countTypeTaken="'+ data.gamename +'"]').attr('data-currentCount'));
var slotsBefore = parseInt(this.scope.find('[data-countTypeSlots="'+ data.gamename +'"]').attr('data-currentCount'));
this.scope.find('[data-countTypeTaken="'+ data.gamename +'"]').attr( 'data-currentCount', takenBefore + 1 ).text(takenBefore + 1);

 

Заходит игрок, добавляем к тексту + 1, но мне еще нужно обработать условия в стилях. Как примерно это сделать?

 

Добавить переменную, где вычитается весь стиль, ipsBadge_positive, ipsBadge_intermediary, ipsBadge_negative и делать замену текущего стиля на новый, только тоже не понятно, либо менять только сам стиль, либо весь класс.

 

-----------------------------------------------

Ну вот это я имел ввиду: только у меня первое условие почему-то не работает, почему? ipsBadge_negative - работает.

// Обновление слотов
var takenBefore = parseInt(this.scope.find('[data-countTypeTaken="'+ data.gamename +'"]').attr('data-currentCount'));
var slots = parseInt(this.scope.find('[data-countTypeSlots="'+ data.gamename +'"]').attr('data-currentCount'));
var takenAfter = takenBefore + 1;
var ipsBadge = null;

if (slots - takenAfter > 2) {
ipsBadge = 'ipsBadge_positive';
} else if (slots === takenAfter) {
ipsBadge = 'ipsBadge_negative';
} else {
ipsBadge = 'ipsBadge_intermediary';
}

this.scope.find('[data-countTypeTaken="'+ data.gamename +'"]').attr( 'data-currentCount', takenAfter ).text(takenAfter);

 

Теперь как лучше заменить текущий class который там уже есть вставленный с html?

Изменено пользователем TemKa_SD

Рекомендованные сообщения

Опубликовано:

Удалить классы

.removeClass('ipsBadge_intermediary ipsBadge_positive ipsBadge_negative')

Добавить класс

.addClass(ipsBadge)

Создайте аккаунт или войдите в него для комментирования

Сейчас на странице 0

  • Нет пользователей, просматривающих эту страницу.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.