Wie setze ich ein Element auf den Wert einer Variablen mit Jquery

Question

Ich baue eine Portfolio-Website. Der Benutzer kann mit der linken und rechten Pfeiltaste durch meine Arbeit klicken. Die Pfeile links und rechts setzen die Variable x auf 1,2 oder 3 und senden sie über eine Funktion "workSelection". Wenn der Benutzer durch die Arbeit klickt, möchte ich den Arbeitstitel aktualisieren, damit er mit der Variablen der ausgewählten Arbeit übereinstimmt (1,2 oder 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++; 
     } 
} 

Wie kann ich ändern $ ("# workTitle") html ('workTitle' + Schleife). um den Wert von workTitle1, workTitle2, workTitle3 anzuzeigen. Stattdessen wird jetzt nur eine Zeichenfolge mit dem Wert "workTitle1" usw. angezeigt, nicht der Wert der Variablen selbst.

Danke für jede Hilfe!

Answer 1

Sie window['workTitle'+ loop]

verwenden können

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

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

EDIT: Es gibt keine Notwendigkeit, eine Schleife ist, antwortete ich nur die Frage, wie $("#workTitle").html('workTitle'+loop) ändern Sie den Wert von workTitle1 :)

Answer 2

einfachere Methode

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 3

Dies ist, wo Sie eine Array wollen anstatt einzelne Variablen. Während es mit JavaScript möglich ist, einzelne Variablen zu verwenden (mit eval, die Sie vermeiden sollten, oder indem Sie sie globals machen und die Tatsache verwenden, dass sie Eigenschaften von window werden), gibt es keinen guten Grund dazu.

Hier ist die Array-Version. Beachten Sie, dass Indizes bei 0 beginnen:

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++; 
    } 
} 

Ich sehe keine Notwendigkeit, dass die Schleife, aber:

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

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

Answer 4

ein Array verwenden

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

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


} 

Answer 5

Ihre Logik ist komplizierter angezeigt werden, als es sein muss. Wenn Sie die mehreren Strings so ändern, dass alle in einem Array gespeichert werden, können Sie sie direkt nach Index abrufen, anstatt sie alle zu durchlaufen. Versuchen Sie Folgendes:

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

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