如何使引导日期选择器只读?

2024-05-17

我正在努力创建嵌入式/内联日期选择器,它不可点击 - 它应该只显示日期,表现为只读。

我正在做的是用模型中选定的日期填充日历,然后我尝试使其不可点击,这样用户就不会认为他可以编辑任何内容。

我正在使用 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>只读,但仍然能够从日期选择器中选择日期。


接受的答案对我来说不起作用,但另一种方法是使用为与 JQuery datepicker 相关的类似问题提供的优雅解决方案(请参阅https://stackoverflow.com/a/8315058/2396046 https://stackoverflow.com/a/8315058/2396046)

要为 Bootstrap Datepicker 执行此操作,如下所示:

$('#datepicker-inline').datepicker({
   //Other options...
   beforeShowDay: function() {
      return false;
   }
});

这使得日历对话框完好无损,但所有日期都呈灰色。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使引导日期选择器只读? 的相关文章

  • 有不同图像尺寸的缩略图 Bootstrap

    我想要包含不同大小和不同文本量的图像的缩略图 但我希望它们都具有相同的大小 像这样来自 Bootstrap 站点的示例 http getbootstrap com components thumbnails custom content 下
  • 如何仅在第一次访问时弹出模态窗口

    我有一个模式窗口 当您访问某个页面时会弹出 访客必须选择我同意或我不同意 我需要一个漂亮的小 jquery 脚本 它会记住谁之前访问过该页面并同意 这样他们每次访问该页面时就不会弹出模式 有人可以推荐一个好的脚本来使用吗 这是代码 div
  • 谷歌闭包编译器和jquery

    我将 js 代码复制粘贴到谷歌编译器中 当我将其复制回我的应用程序时 它不起作用 我意识到我的代码需要jquery 所以我将jquery代码和我的代码复制到google编译器中 希望它能轻松解决问题 但它也不起作用 在chrome下 代码有
  • POST 表单数据为 application/json

    我正在开发一个 API 它接收 application json post 请求 并触发一些流程 我目前的主要问题是发送一个 application json 帖子 其中包含来自输 入表单的数据 我已经尝试过 jQuery ajax 但由于
  • 如何选择两个元素之间的所有元素

    我想选择两个给定元素之间的所有元素 我有这样的html h2 This is firsty h2 p Some para p ul li list items li li list items li li list items li li
  • Bootstrap:使用单个选项卡导航控制多个选项卡面板

    我想用一个选项卡导航来控制两个不同的选项卡内容 在 Bootstrap 3 中 我有一个使用逗号分隔数据目标的解决方案 如本例所示 https stackoverflow com a 19719859 1788961 https stack
  • jQuery - 将所有展开的文本包装在 p 标签中

    我遇到以下情况 以下代码被写入我的页面 div Some text here which is not wrapped in tags p Some more text which is fine p p Blah blah another
  • jqgrid 在编辑框中选择不正确的下拉选项值

    我正在使用表单编辑 表单中有两个选择框 一个选择框是国家 地区 另一个选择框是州 州选择框取决于所选的国家 地区 并将动态填充 例如 Country 美国 期权价值 1 英国 期权价值 2 美国的状态 阿拉巴马州 选项值 1 加利福尼亚州
  • 需要禁用引导时间选择器的输入

    我正在使用 Bootstrap 时间选择器 我已经成功实施了 但我需要的是用户只能在 30 分钟间隙内插入 例如 10 00 10 30 11 00 等 为此我尝试过的是minuteStep如下图所示 效果完美 fantasyleague
  • jQuery 日期选择器 - 时区问题

    我们在网站上使用 jQuery 日期选择器来选择预订的日期和时间 日历当前设置为太平洋标准时间 当用户尝试从其他时区访问时 这会导致错误 我们是否应该将服务器设置为 UTC 并让应用程序根据用户的 IP 地址自动选择用户的时区 我很好奇我们
  • 如何在 jQuery 中使用 CSS“background-image”属性添加的图像上绑定单击事件

    这是我的小提琴link http jsbin com otisur 1 edit 我想我的问题通过标题本身就很清楚了 尽管如此 我正在寻找一种绑定的方法click使用 css 添加的图像上的事件background image财产 我知道
  • 使用 jQuery 拖放

    我想使用 jQuery 进行简单的拖放操作 到目前为止我还没有做任何事情 但之前的尝试都没有成功 你有没有尝试过jQuery UI 可拖动 http jqueryui com demos draggable 简单用例 div class u
  • jQuery 单属性、带过滤器的多值选择器

    Images var boxlinks a href filter href png href gif href jpg href jpeg 有没有更有效的方法来使用 jQuery 中的过滤器选择单个属性的多个值 这里我尝试仅选择带有图像作
  • jQuery - 拖动div css背景

    我希望能够在 div 内按住鼠标并移动它的背景 在谷歌上搜索了很多 没有找到我想要的 这是目标 显示的地图是要拖动的对象 http pontografico net pvt gamemap http pontografico net pvt
  • 如何使用javascript隐藏div

    我想使用 Javascript 隐藏一个 div 下面是我的div div class ui dialog titlebar ui widget header ui corner all ui helper clearfix span cl
  • 如何使用 jQuery UI Sortable 正确相交?

    这是我对 jQuery UI Sortable 进行动画处理的尝试 https codepen io anon pen YdMOXE https codepen io anon pen YdMOXE var startIndex chang
  • 如何中和 CSS 定义而不覆盖

    有没有一种方法可以中和元素的 CSS 规则而不覆盖所有内容 例如 我正在使用 Twitter Bootstrap 它有许多预定义的 CSS 定义table 在某些地方 我不想要它们 对某些table元素 我想知道我是否可以做这样的事情 ta
  • 动态地将 .on() 方法与事件映射绑定

    我使用此语法来确保事件绑定动态添加li元素 ul list on click li function do something 我尝试使用这样的事件映射来存档相同的内容 ul list hammer css hacks false on s
  • 使用jquery和coldfusion cffile上传多个文件

    不是一个真正的问题 只是想将其发布在某个地方 因为我在其他地方找不到它 现在我已经拼凑了一个工作演示 我想我会分享 这在 Coldfusion 和 Railo CFML 服务器上同样有 效 问题是 对于 CFML 开发人员来说 CFFILE
  • Skrollr 添加空白

    我已经尝试了一切 我在谷歌上阅读了 4 5 页试图找到适合我的修复程序 已经筋疲力尽了 即使我使用 skrollr 示例 我的问题仍然存在 不是说他们做错了什么 我知道我只是没有正确理解它 因此 我上传了一个演示 仅在移动设备上展示这个尴尬

随机推荐

  • 如果其中一台机器死机,TCP 连接如何终止?

    如果两个主机 A 和 B 之间建立了 TCP 连接 假设主机 A 已向主机 B 发送了 5 个八位字节 然后主机 B 崩溃了 由于未知原因 主机 A 将等待确认 但如果没有收到确认 将重新发送八位字节并减小发送者窗口大小 这将重复几次 直到
  • Spring Security 自定义过滤器

    我想自定义 Spring security 3 0 5 并将登录 URL 更改为 login 而不是 j spring security check 我需要做的是允许登录 目录并保护 admin report html 页面 首先 我使用教
  • pubnub 和 head.js

    有没有人成功整合过pubnub http www pubnub com 和 head js 正确吗 Pubnub http www pubnub com 希望我将他们的脚本放在页面底部并带有 div 就在它前面的标签 这可以确保在最后调用
  • AXI4 流接口:如何在 HLS 中管理浮点数组以生成硬件加速器并在 RTL 项目中安全地连接它们?

    最后 我想做的是使用 Vivado Design Suite 中具有单精度浮点数组的流接口来构建硬件加速器 HLS 用户指南UG902 http www xilinx com support documentation sw manuals
  • Jasmine-jQuery loadFixtures 未定义

    我对整个茉莉花的事情仍然很陌生 在过去的几个小时里我陷入了这个问题 我尝试使用 loadFixture 加载外部夹具文件 我使用 Jasmine 2 0 0 和 Jasmine jQuery 2 0 5 ReferenceError loa
  • React Native Android 发布 apk 是调试,而不是发布

    我有一个现有的 Android 应用程序 我已根据以下内容将 React Native v0 30 活动添加到项目中docs http facebook github io react native releases next docs i
  • 如何在 C# 中将 MemberExpression 实例组合为 LambdaExpression?

    给定一个这样的类 public class AnEntity public int prop1 get set public string prop2 get set public string prop3 get set 我能够生成一个
  • 为什么LeNet5使用32×32图像作为输入?

    我知道mnist数据集中的手写数字图像是28 28 但是为什么LeNet5中的输入是32 32 您的问题已在原纸 http yann lecun com exdb publis pdf lecun 98 pdf 卷积步骤始终采用比前一层的特
  • 为多模块项目创建所有 jar 和源 jar 的存档

    我正在构建一个 Maven 项目 其中有六个模块 我可以自己使用 Maven 或 Ivy 导入它 但其他团队也想使用这些 jar 但他们的做法是将 jar 和源 jar 提交到版本控制 我想生成所有模块及其源代码的 zip tar 程序集
  • 如何获取字符串的最后一个单词?

    我有一个批处理文件 它以文件路径作为参数 set filePath 1 现在 假设文件路径是 C Temp Folder 我想设置Folder在一个新变量中 我怎样才能做到这一点 我在网上搜索了一下 所有的解决方案都是这样的 for A i
  • 访问角落里的存储

    我能找到的与文件存储有关的最接近文档的是这个帖子 http nookdeveloper zendesk com entries 20257971 updated what are the size constraints on my app
  • 有没有办法同时拥有加密和非加密的主机变量?

    如果我加密host vars 文件与ansible vault 除了清单文件中的主机变量之外 我似乎没有机会拥有未加密的主机变量 我错过了什么吗 事实证明 http docs ansible com ansible intro invent
  • Composer 用于下载私有 GitHub 存储库

    我无法使用 Composer 下载 github 私人存储库 php composer phar update 我收到以下错误 The https api github com repos company private1 https ap
  • 从 SHAP 值中获取特征重要性

    我想要获得重要功能的数据框 通过下面的代码 我得到了 shap values 但我不确定这些值的含义是什么 在我的 df 中有 142 个特征和 67 个实验 但得到了一个带有 ca 的数组 2500 个值 explainer shap T
  • 使用 PortAudio 回调和 ASIO sdk 实现输入延迟

    我正在尝试使用 portaudio 库和 ASIO sdk 从我的计算机获取吉他的输入以进行演奏 我一直在关注官方网站上的一些教程来进行基础设置 目前我已经让它工作了 以便 portaudio 正在监听正确的输入和输出设备 并且我有回调设置
  • 调用 SwiftUI 中位置 #11、#12 处的额外参数 [重复]

    这个问题在这里已经有答案了 我在 SwiftUI 中的切换开关上不断收到 调用中位置 11 12 处有额外参数 错误 我见过其他人有 调用中的额外参数 错误 但答案似乎没有帮助 另外 我的错误是 位置 11 12 我还没有看到其他人发生这种
  • 在 WebView 中完成 AdBlock

    我即将在我的 Android 应用程序中推出 WebView AdBlocking 我想知道这是否会有效地阻止广告 或者在 Webview 本身内是否还有更多工作要做 我尚未修改 基本上我有一个存储在 Android 资产中的主机文件 其中
  • 在 gulp 中复制文件时可以删除文件夹结构吗?

    如果我使用 gulp src app client html pipe gulp dest dist 我的文件夹结构 html文件位于 维护于dist文件夹 但我想完全删除文件夹结构 只删除我的平面层次结构dist folder 你可以使用
  • CSS3DObject 始终位于 WebGL Mesh 前面

    我正在混合CSS3D Renderer with WebGL Renderer to add HTML3D 空间中的元素WebGL场景 这CSS3DObject在前面WebGL网格即使WebGL Renderer具有较高的 z index
  • 如何使引导日期选择器只读?

    我正在努力创建嵌入式 内联日期选择器 它不可点击 它应该只显示日期 表现为只读 我正在做的是用模型中选定的日期填充日历 然后我尝试使其不可点击 这样用户就不会认为他可以编辑任何内容 我正在使用 eternicode bootstrap da