我有一个在 Laravel 中完成的日程安排应用程序,它应该使您能够选择要预订项目的时间段。如果单击 9:00,您将获得 9:30 以后的下拉列表,增量为 30 分钟。我正在使用 Bootstraps 下拉菜单。
<div class="dropdown">
<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Reserve
until
<span class="caret"></span></button>
<ul class="dropdown-menu">
</ul>
</div>
下拉菜单工作正常,但我想以某种方式获取所选值
<script>
$('#confirm-reservation').on('show.bs.modal', function (e) {
$(this).find('.dropdown-menu li').remove();
$(this).find('.btn-ok').attr('href', $(e.relatedTarget).data('href'));
var startTime = moment($(e.relatedTarget).data('start-time')).utc();
var endTime = moment($(e.relatedTarget).data('end-time')).utc();
while (startTime < endTime) {
$(this).find('.dropdown-menu').append('<li><a href="#">' + startTime.format("HH:mm") + '</a></li>');
startTime.add(30, 'minutes');
}
});
</script>
最佳答案
在下拉列表中添加事件处理程序,如下所示,
$(document).on('click','#confirm-reservation .dropdown-menu a', function(){
console.log("Selected "+ $(this).text());
});
我已将事件委托(delegate)给 document
,因为初始化事件处理程序时列表项不会出现。
希望这有帮助。
关于javascript - jQuery 选择模式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42807616/