javascript - 使用 jQuery 从 HTML 属性中收集数据

Question

我正在尝试制作一个 Web 表单，以将不确定数量的员工标记为在场或缺席。页面本身包含任意数量的以下形式的 div:

<div class="employee" empID="9" presence="0">

div 本身包含选项，根据所选选项使用 jQuery 将“存在”更改为 1 或 2。

按下“提交”按钮后，我想将此数据转换为可解析的“empID”和“presence”对数组。我已经尝试使用 jQuery 执行此操作，如下所示:

$('.cic-button').click(function(){
        var submitData = {employees:[]};
        $('firedrill-employee').each(function(){
            submitData.push({
                employeeID: $(this).attr('empID'),
                presence: $(this).attr('presence')
            });
        });
    });

但是，完成此操作后，submitData 变量无法填充。知道为什么吗？我是否以正确的方式解决这个问题？我尝试做的事情是否可行？

非常感谢。

Answer 1

你有一些错误。使您在“employee”而不是“firedrill-employee”集合上迭代的类，并且不要忘记用点表示它是一个类。使用 submitData 对象引用 employees 数组。您不能只是将一个元素推送到一个对象中。

$('.cic-button').click(function () {
    var submitData = {
        employees: []
    };
    $('.employee').each(function () {
        submitData.employees.push({
            employeeID: $(this).data('empID'),
            presence: $(this).data('presence')
        });
    });
    console.log(submitData);
});

Fiddle