Jquery не отдает текст элемента

У меня есть набор одинаковых тегов с разным содержимым. Как видите при нажатии я вызываю функцию helper_command().

function helper_command() {
    alert($(this).text());
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="command" onclick="helper_command()">
  Создать сет
</div>
<div class="command" onclick="helper_command()">
  Мои сеты
</div>
<div class="command" onclick="helper_command()">
  Баланс
</div>

Но когда я нажимаю у меня выводится пустой текст, почему?


Ответы (1 шт):

Автор решения: DiD

Потому что контекст не передаётся. Чтобы его передать можно воспользоваться методами .apply() или .call().

function helper_command() {
    alert($(this).text());
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="command" onclick="helper_command.apply(this)">
  Создать сет
</div>
<div class="command" onclick="helper_command.apply(this)">
  Мои сеты
</div>
<div class="command" onclick="helper_command.apply(this)">
  Баланс
</div>

Либо, что еще лучше, передавать объект события.

function helper_command(event) {
    alert($(event.target).text());
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="command" onclick="helper_command(event)">
  Создать сет
</div>
<div class="command" onclick="helper_command(event)">
  Мои сеты
</div>
<div class="command" onclick="helper_command(event)">
  Баланс
</div>

→ Ссылка