jQuery - обрабатывает строку как имя переменной и возвращает ее значение

Question

У меня есть несколько переменных, содержащих текстовые строки, и я хочу выбрать, которые должны отображаться в зависимости от элемента, по которому щелкнули.

Приведенный ниже код является очень упрощенной версией того, что я пытаюсь сделать., в данный момент он устанавливает innerHTML для .msgBox в 'A_msg' или 'B_msg', и я хочу установить значение этих переменных.

    var A_msg = "You clicked A";
    var B_msg = "You clicked B";

    $(".trigger").mouseover(function() {
      var MsgToDisplay = $(this).attr('id')+"_msg";
      $('#msgBox').html(MsgToDisplay);
    });

    <div class="trigger" id="A">Option A</div>
    <div class="trigger" id="B">Option B</div>
    <div id="msgBox"></div>

Answer 1

Вы должны использовать объект:

var messages = {
    A: "You clicked A",
    B: "You clicked B"
};

$(".trigger").mouseover(function() {
  var MsgToDisplay = messages[$(this).attr('id')];
  $('#msgBox').html(MsgToDisplay);
});

Вы можете написать messages[someString], чтобы получить значение свойства по имени.