我必须为5000多个不同的组合创建业务规则(150多个项目,每个组合6-10组选项)。我已创建此功能以自动生成组合,但我希望能够更改计数器以便我可以跳过某些组合。如何修改函数,以便在表单元素的值更改时正确重置数组计数器?我相信这也需要函数反向并在数组计数器更改时更改表单元素的值。
我为表单元素(在change
)上创建了单独的函数,以迭代数组(在click
)上,并且两个函数都将当前组合写入相同的目标(即#current_body_part
和#current_description
)。这两个函数还从这些目标onload
获取文本,以编程方式设置数组计数器和表单元素值,但我无法动态更新它们。我在这里发布了一个代码的工作示例:http://jsfiddle.net/chayacooper/SvqM5/
编辑 - 我不熟悉以这种方式使用数组,我对其他方法(例如使用jQuery.each()
)持开放态度,但是将它应用到我的代码中需要一些帮助。
遍历数组的函数
$(document).ready(function(){
// Counters start at value displayed in #current_body_part & #current_description
var bodyPart = new Array ("Shoulders", "Waist", "Height");
var counterBodyPart = bodyPart.indexOf($('#current_body_part').innerHTML);
var description1 = new Array ("Narrow", "Average", "Wide");
var description1Number = description1.indexOf($('#current_description').innerHTML);
var description2 = new Array ("Short", "Average", "Tall");
var description2Number = description2.indexOf($('#current_description').innerHTML);
$('#next').click(function(){
if (bodyPart[counterBodyPart] === "Shoulders" || bodyPart[counterBodyPart] === "Waist" ){
if (description1Number < description1.length){
$('#current_body_part').innerHTML = bodyPart[counterBodyPart];
$('#current_description').innerHTML = description1[description1Number];
description1Number++
description2Number = 0;
} else if (counterBodyPart < bodyPart.length){
$('#current_body_part').innerHTML = bodyPart[counterBodyPart];
counterBodyPart++;
description1Number = 0;
}
}
if (bodyPart[counterBodyPart] === "Height"){
if (description2Number < description2.length){
$('#current_body_part').innerHTML = bodyPart[counterBodyPart];
$('#current_description').innerHTML = description2[description2Number];
description2Number++
description1Number = 0;
} else if (counterBodyPart < bodyPart.length){
$('#current_body_part').innerHTML = bodyPart[counterBodyPart];
counterBodyPart++;
description2Number = 0;
}
}
});
});
表单元素的功能
$('select[name="body_part"]').change(function () {
writeVal();
current_description.innerHTML = '';
$('input[name="current_description"]').val('');
});
$('input:radio[name="description"]').change(function () {
writeVal();
});
function writeVal() {
var body_part = $("select[name=body_part] option:selected").val();
current_body_part.innerHTML = body_part;
$('input[name="current_body_part"]').val(body_part);
var description = $("input:radio[name=description]:checked").val();
current_description.innerHTML = description;
$('input[name="current_description"]').val(description);
}