我想我将从link to a jsfiddle of my project开始
我将解释它应该如何工作以及我的主要问题。
基本上,它的顶部有一个由选择器框描绘的三行。每行都有不同数量的“部分”,这些部分显示在左侧栏中。选择零件后,表格会向上滑动以输入信息(但现在可以忽略)。提交后,应将新的“职位”添加到列表中。到目前为止,一切都很好。
当我换线时,我的问题来了。由于某种原因,每当我从默认的第一行切换行时,就无法再将作业添加到列表中。我的.on()监听器只是停止意识到我完全单击了按钮。
基本上,我是一名工程专业的学生,从事他的高级设计项目,并且必须自学所有这些Web编程知识,因为这是客户想要的(即使这并非完全属于我的专业领域)。无论如何,我知道这是一个漫长的问题,所以人们不会倾向于帮助我,但是我无法描述自己的欣赏程度。因为有几百行代码,所以我会回答所有问题。
以下是我认为可能相关的代码部分:
$('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;
}
最佳答案
这:
$('ul#parts').find('button').on('click', function(){
ADDUPDATETOGGLE = "ADD";
CSPC = $(this).attr("data-part");
showForm();
});
应该:
$('ul#parts').on('click', 'button', function(){
ADDUPDATETOGGLE = "ADD";
CSPC = $(this).attr("data-part");
showForm();
});
您希望绑定(bind)到稳定的父元素,以便当按钮全部更改时,您仍然可以响应事件。通过使用
.find()
,您可以将处理程序直接附加到最初的按钮组。一旦更换它们,处理人员就迷路了。关于javascript - ".on()" Action 监听器似乎停止工作,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/15888450/