获取特定元素的数据值

Question

当创建允许用户选择希望运行任务的月，日，小时和分钟的调度程序类型系统时，我已经创建了代表每个选项的DIV。 我使用“数据值”来存储表示形式的实际整数值。

当他们提交表单时，我需要收集此信息以放入数组中并传递给AJAX。 但是，我正在努力寻找方法。 我基本上需要使用“选定”类的所有月份，使用“选定”类的所有小时，依此类推。 谁能阐明我该怎么做？

我想象有某种方法可以检查DIV容器中的每个元素，但是我不确定该怎么做。

var monthsContainer = $("#schedMonthsContainer");
var daysContainer = $("#schedDaysContainer");

for (i = 0; i < MonthsOfYear.length; i++)
{
    var month = MonthsOfYear[i];
    var monthEl = $("<div>", { 'class': "timeSegment selected", 'data-value': i, text: month });
    monthsContainer.append(monthEl);
}

for (i = 0; i < DaysOfWeek.length; i++)
{
    var day = DaysOfWeek[i];
    var dayEl = $("<div>", { 'class': "timeSegment selected", 'data-value': i, text: day });
    daysContainer.append(dayEl);
}

的HTML

                            <div class="twelveSegmentContainer">
                                <div id="schedMonthsContainer"></div>
                            </div>

                            <div class="sevenSegmentContainer">
                                <div id="schedDaysContainer"></div>
                            </div>

Answer 1

以下将查找同时具有timeSegment类和selected类的所有元素：

$('.timeSegment.selected')

因此，使用上述方法，您可以像这样检索data-value属性data-value ：

$('.timeSegment.selected').each(function(index) {
    console.log($(this).data('value'));
});

更新资料

可以使用以下方法确定哪个父项属于$(this) ： parent() ，也可以在特定元素上使用find() 。

选项1：使用parent() ：

$('.timeSegment.selected').each(function(index) {
    var parent = $(this).parent();
    console.log(parent.attr('id'));
    console.log($(this).data('value'));
});

上面的代码将检索父元素的id ，因此可以是schedMonthsContainer或其他容器之一。

选项2：对特定元素使用find() ：

$('#schedMonthsContainer').find('.timeSegment.selected').each(function(index) {
    console.log($(this).data('value'));
});

上面的方法将只在月份容器中检索具有timeSegment和selected类的元素。