在添加类之后获取元素文本值

Question

我正在尝试获取在单击后添加类的元素的文本值。但我无法得到它。我也尝试过使用html（）。

 let selectLevel;

function selectOption(menu) {

  $(menu).on('click', "li", function() {

    $(menu).find('.activeSelection').removeClass();
    $(this).addClass('activeSelection');

  });
}

$(document).ready(function() {

  selectOption('.levelList');

  selectLevel = $('.levelList').find('.activeSelection').text();

});

Answer 1

我能想象的最简单的方法是在单击list元素时触发自定义事件，然后将函数绑定到此事件以更新变量。

以下示例：

＆＃13;

＆＃13;

let selectLevel;

function selectOption(menu) {

  $(menu).on('click', "li", function() {

    $(menu).find('.activeSelection').removeClass();
    $(this).addClass('activeSelection');
    $(menu).trigger('itemChanged'); //trigger custom event
  });
}

$(document).ready(function() {

  selectOption('.levelList');

  $('.levelList').on('itemChanged', function() { // wait for event on your menu
    selectLevel = $(this).find('.activeSelection').text();
    console.log(selectLevel); // just logging the current value
  });
  
});

＆＃13;

.activeSelection {
  font-weight: bold;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul class="levelList">
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

＆＃13;

＆＃13;

＆＃13;