如何使用jQuery將元素設置為變量的值

Question

我正在建立一個投資組合網站。 用戶可以使用左右箭頭點擊我的作品。 左右箭頭將變量x設置為1,2或3，並通過“ workSelection”函數將其發送。 當用戶單擊作品時，我希望它更新作品標題以匹配所選作品的變量（1、2或3）。

var workTitle1 = "Work 1";
var workTitle2 = "Work 2";
var workTitle3 = "Work 3";

function workSelection(x)
{
      var loop = 1;
      while (loop < 4)
        {
          if (x == loop)
            {
                $("#workTitle").html('workTitle'+loop);
            }
          loop++;
        }
}

如何更改$（“＃workTitle”）。html（ 'workTitle'+ loop ）; 顯示workTitle1，workTitle2，workTitle3的值。 相反，現在只顯示一個值為“ workTitle1”等的字符串，而不是變量本身的值。

謝謝你的幫助！

Answer 1

您可以使用window['workTitle'+ loop]

var workTitle1 = "Work 1";
var workTitle2 = "Work 2";
var workTitle3 = "Work 3";

function workSelection(x)
{
    $("#workTitle").html(window['workTitle'+ x]);
}

編輯：無需循環，我只是回答了如何更改$("#workTitle").html('workTitle'+loop)以顯示workTitle1 :)值的workTitle1

Answer 2

您的邏輯比需要的復雜。 如果將多個字符串全部更改為存儲在數組中，則可以直接通過索引檢索它們，而不必遍歷它們。 嘗試這個：

var workTitles = [ "Work 1", "Work 2", "Work 3" ];

function workSelection(x) {
    $("#workTitle").html(workTitles[x-1]);
}

Answer 3

更簡單的方法

var workTitle = [];
workTitle[0] = "Work 1";
workTitle[1] = "Work 2";
workTitle[2] = "Work 3";

function workSelection(x)
{
      var loop = 0;
      while (loop < 3)
        {
          if (x == loop)
            {
                $("#workTitle").html(workTitle[loop]);
            }
          loop++;
        }
}

Answer 4

這是您想要數組而不是單個變量的地方。 雖然可以使用JavaScript使用單個變量（與eval ，你應該避免，或使其全局和使用它們成為性能的事實window ），沒有充分的理由。

這是陣列版本。 請注意，索引從0開始：

var workTitles = [
    "Work 1",
    "Work 2",
    "Work 3"
];
function workSelection(x) {
    for (var loop = 0; loop < workTitles.length; ++loop) {
        if (x == loop + 1) { // Note the comparison, since `x` appears to be 1-based
            $("#workTitle").html(workTitles[loop]);
        }
        loop++;
    }
}

不過，我認為不需要循環：

var workTitles = [
    "Work 1",
    "Work 2",
    "Work 3"
];

function workSelection(x)
{
    $("#workTitle").html(workTitles[x - 1]);
}

Answer 5

使用數組

var workTitles = ["Work 1","Work 2","Work 3"];

function workSelection(x)
{
  $("#workTitle").html(workTitles[x]);


}