Question

我有以下jquery代码：

$('.kv-editable-reset').addClass('green');

应将“绿色”类添加到此元素：

<button type="button" class="btn kv-editable-reset"></button>

，但是它不起作用，因为单击以下按钮后，.kv-editable-reset仅在页面的稍后出现：

<button type="button" class="kv-editable-link"></button>

如何仅在点击后，才检测页面中显示的元素？

Answer 1

只需监听该按钮的click事件，然后重新添加.green类即可。

通过使用.toggleClass('green', true)，您甚至不必担心拿起预先存在的按钮并将此类重新分配给他们

$(() => {
  $('.kv-editable-link').on('click', function() {
    $("html").append(`<button type="button" class="btn kv-editable-reset">kv-editable-reset</button>`);
    $('.kv-editable-reset').toggleClass('green', true);
  });
});

.green{
  background-color: #0f0;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" class="kv-editable-link">kv-editable-link</button>

如何将class添加到页面稍后显示的元素？

1 个答案: