这是一把提琴供参考https://jsfiddle.net/mc6jqtzr/
我需要能够填充 #date
仅当至少有一个 option
在上面的“选择”列表中,未应用样式(在本例中为“显示”特性)。
e、 g.最后一个 option
没有应用样式,因此 #date
应该得到填充。
var date = $("#date");
// Show the date only if there are open spots
if ($('.js-check-in-times option:visible').length === 0) {
date.html('');
} else {
date.html('Working now.');
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="check-in__select js-check-in-times" id="time" name="AptTime" required="" aria-required="true" aria-label="times filter">
<option value="2021-07-28T08:15:00.000-04:00" data-group="2021-07-28" style="display: none;">08:15 AM</option>
<option value="2021-07-28T08:30:00.000-04:00" data-group="2021-07-28" style="display: none;">08:30 AM</option>
<option value="2021-07-28T08:45:00.000-04:00" data-group="2021-07-28" style="">08:45 AM</option>
</select>
<div id="date" style="font-size: 24px; color: red; font-family: sans-serif;"></div>
3条答案
按热度按时间slwdgvem1#
您可以在选项之间循环以获取隐藏选项的计数,然后根据显示消息来检查“隐藏总数”和“隐藏总数”选项是否相同。
演示代码:
sdnqo3pr2#
您可以选择所有选项,然后获取样式属性并选中
检查样式是否为空
检查是否仅显示可见选项及其样式
hgc7kmma3#
滤器
options
基于style
属性如果缺少样式属性,请与进行比较
null
而不是''
```var date = $("#date");
// Show the date only if there are open spots
var optionsWithEmptyStyle = $('.js-check-in-times option').filter(function() {
return $(this).attr('style') === '';
});
if (optionsWithEmptyStyle.length === 0) {
date.html('');
} else {
date.html('Working now.');
}