Удалить класс из элемента внутри начальной загрузки - PullRequest
0 голосов
/ 04 октября 2018

Я использую всплывающее окно начальной загрузки, чтобы показать список доступных действий для списка получателей.Popover:

<ul class='list-unstyled recipients-popover'>
<li><a href='#' class='popover-item' onclick='openAddContactModal()'><i class='test'></i> &nbsp; Add contact</a></li>
<li><a href='#' class='popover-item'><i class='test'></i> &nbsp; Add contact list</a></li>
<li><a href='#' class='popover-item disabled' onclick='deleteContacts()'><i class='test'></i> &nbsp; Delete contacts</a></li>
<li><a href='#' class='popover-item' onclick='openAddGroupModal()'><i class='test'></i> &nbsp; Create new group</a></li>
<li><a href='#' class='popover-item disabled' onclick='openAddContactToGroupModal()'><i class='test'></i> &nbsp; Add contacts to group</a></li>
<li><a href='#' class='popover-item disabled'><i class='test'></i> &nbsp; Remove contacts from Group</a></li>
<li><a href='#' class='popover-item' onclick='openDeleteGroupModal()'><i class='test'></i> &nbsp; Delete Group</a></li>

Выше приведено ниже HTML:

<a class="btn btn-link text-white" tabindex="0" role="button" data-html="true" data-trigger="focus" data-container="body" data-toggle="popover" data-placement="auto" data-content=" @include('recipient.actions-popover') ">

Тогда возникает проблема, когда я пытаюсь запустить javascript на всплывающем окне, он не работает,Например, если я попытаюсь запустить:

$(document).on('change', '.checkable', function(e) {
    console.log("testing");
    $(".popover-item").removeClass('disabled');
});

Отключенный класс не удаляется, хотя я вижу журнал консоли тестирования.

Может кто-нибудь помочь заставить работать выше?

1 Ответ

0 голосов
/ 04 октября 2018

Если вы просто хотите удалить класс при смене флажка, это прекрасно работает:

$(".checkable").change(function() {
       $(".popover-item").removeClass('disabled');
});
.disabled{
  color:red
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class='list-unstyled recipients-popover'>
<li><a href='#' class='popover-item' onclick='openAddContactModal()'><i class='test'></i> &nbsp; Add contact</a></li>
<li><a href='#' class='popover-item'><i class='test'></i> &nbsp; Add contact list</a></li>
<li><a href='#' class='popover-item disabled' onclick='deleteContacts()'><i class='test'></i> &nbsp; Delete contacts</a></li>
<li><a href='#' class='popover-item' onclick='openAddGroupModal()'><i class='test'></i> &nbsp; Create new group</a></li>
<li><a href='#' class='popover-item disabled' onclick='openAddContactToGroupModal()'><i class='test'></i> &nbsp; Add contacts to group</a></li>
<li><a href='#' class='popover-item disabled'><i class='test'></i> &nbsp; Remove contacts from Group</a></li>
<li><a href='#' class='popover-item' onclick='openDeleteGroupModal()'><i class='test'></i> &nbsp; Delete Group</a></li>

<label>Checkable</label> <input type="checkbox" name="recipient[3]" class="checkable" contactid="3">
...