我正在努力创建无法点击的嵌入式/内联日期选择器 – 它应该只显示日期,表现为只读.
我正在做的是用模型中的选定日期填充日历,然后我尝试使其无法点击,因此用户不会瘦,他可以编辑任何内容.
我正在使用eternicode-bootstrap-datepicker – 使其成为多日期.
到目前为止,我有这个:
<link rel="stylesheet" href="<c:url value="/resources/js/lib/eternicode-bootstrap-datepicker/css/datepicker3.css" />" /> <script src="<c:url value="/resources/js/lib/eternicode-bootstrap-datepicker/js/bootstrap-datepicker.js"/>"></script> <script type="text/javascript"> $(document).ready(function() { $("#datepicker-inline").datepicker({ multidate : true,todayHighlight : true,}); var dates = []; var i = 0; <c:forEach items="${course.selectedDates}" var="selectedDate"> console.log("${selectedDate}"); dates[i++] = new Date("${selectedDate}"); </c:forEach> $("#datepicker-inline").datepicker('setDates',dates); // something to make it readonly $(".day").click(function(event) { console.log("preventing"); event.preventDefault(); }); }); </script> <div class="col-xs-8"> <h4>Dates</h4> <div id="datepicker-inline"></div> </div>
[对不起,如果格式错误]
如您所见,我正在尝试阻止日历中.day上的默认点击操作.控制台显示“正在阻止”,但仍会将日期视为已选中.
你知道如何让它成为禁用/不活动/只读吗?
关于制作< input>的所有只读主题readonly,但仍然能够从datepicker中选择日期.