A „.auf()“ Aktion Zuhörer scheinen

Question

arbeiten zu stoppen Ich denke, ich werde mit einem link to a jsfiddle of my project beginnen

ich erklären werde, wie es sollte funktionieren und mein Hauptproblem.

Im Grunde hat es drei "Linien", die oben durch eine Auswahlbox dargestellt sind. Jede Zeile hat eine unterschiedliche Anzahl von "Teilen", die auf der linken Seitenleiste angezeigt werden. Wenn ein Teil ausgewählt ist, wird ein Formular nach oben verschoben, um Informationen einzugeben (aber für den Moment kann es ignoriert werden). Nach dem Senden sollte ein neuer "Job" zur Liste hinzugefügt werden. Das alles funktioniert soweit.

Meine Probleme kommen, wenn ich die Leitungen umschalte. Aus irgendeinem Grund kann ich bei jedem Wechsel von Zeilen aus der ersten Standardzeile keine Jobs mehr zur Liste hinzufügen. Mein .on() - Listener hört einfach auf zu erkennen, dass ich überhaupt auf Schaltflächen klicke.

Im Grunde bin ich ein Ingenieurstudent, der an seinem Senior-Design-Projekt arbeitet und mir all diese Webprogrammierungs-Sachen beibringen musste, weil es genau das ist, was der Kunde wollte (auch wenn es nicht vollständig innerhalb meiner Domänenexpertise liegt). Wie auch immer, ich weiß, dass dies eine lange Frage ist und die Leute werden nicht so geneigt sein, mir zu helfen, aber ich kann nicht beschreiben, wie dankbar ich sein werde. Da es ein paar hundert Zeilen Code gibt, beantworte ich alle möglichen Fragen.

Hier sind die Teile des Codes, die ich denke, kann relevant sein:

$('ul#parts').find('button').on('click', function(){ 
    ADDUPDATETOGGLE = "ADD"; 
    CSPC = $(this).attr("data-part"); 
    showForm(); 
}); 

$('select.lineChoice').on('click', function(){ 
    currentLine = updatePartList(currentLine); 
    updateJobList(jobListByLine[currentLine]); 
}); 

function updateJobList(newJobList){ 
    $("ul#jobs").html(newJobList); 
} 

function updatePartList(currentLine){ 
    var cLine = $('select.lineChoice').find('option:selected').attr('value'), 
     buttonArray = [['A5843', 'A5844', 'B3173', 'B3174', 'B3940', 'B4220', 'B6645', 'B6646', 'B6647', 'B6648', 'B6649', 'B6650', 'B7657', 'B7658', 'B7659', 'B7660'], 
     ['A2279', 'A2280', 'A4451', 'A4453', 'A4454', 'A6499', 'A6500', 'B0934', 'B0935', 'B3810', 'B3871', 'B5532', 'B5533', 'B5709'], 
     ['B0929', 'B0991', 'B1097', 'B3483', 'B3484', 'B3485', 'B6634', 'B7814']], 
     partList = $("ul#parts"); 
    if (cLine == "G1"){ 
     currentLine = 0; 
    } 
    else if(cLine == "R1"){ 
     currentLine = 1; 
    } 
    else if(cLine == "BB3"){ 
     currentLine = 2; 
    } 
    else{ 
     alert("LINE ERROR"); 
     currentLine = 99; 
    } 
    partList.html(buttonHTML(buttonArray[currentLine])); 
    return currentLine; 
} 

Answer 1

Dieses:

$('ul#parts').find('button').on('click', function(){ 
    ADDUPDATETOGGLE = "ADD"; 
    CSPC = $(this).attr("data-part"); 
    showForm(); 
}); 

sein sollte:

$('ul#parts').on('click', 'button', function(){ 
    ADDUPDATETOGGLE = "ADD"; 
    CSPC = $(this).attr("data-part"); 
    showForm(); 
}); 

Sie an eine binden möchten stable Elternelement, so dass, wenn die Tasten alle ändern Sie immer noch auf Ereignisse reagieren. Unter Verwendung von .find() haben Sie Handler direkt mit den ersten Schaltflächen verknüpft. Sobald diese ersetzt wurden, waren die Handler verloren.