给Easyui-Datebox设置隐藏或者不可用的解决方法


Posted in Javascript onMay 26, 2017

我们公司做的是一套安全监测系统。所以呢对于前台页面没有像一些门户网站布局那么丰富,特效特别炫。目前只需要一套简单的UI界面即可,所以我选择了用easyui进行搭建,easyui是一种基于jQuery的用户界面插件集合。使用easyui你不需要写很多代码,你只需要通过编写一些简单HTML标记,就可以定义用户界面。方便而且也比较美观。但是随着项目的进展,对于一些功能的选择上,需要给一些元素加一些样式。渐渐我发现easyui的一些控件对css的兼容性不是很好。于是我总结了一些解决方法如下,我解决的是easyui-datebox控件的隐藏。除此之外我也总结了一些其他控件隐藏或者设置不可用的方法,希望可以提供一些建议。

1.validatebox可以用的用法:前两种适用于单个的validatebox;

  第三种应用于整个form里面的输入框; 

$("#id").attr("readonly", true); ----- $("#id").removeAttr("readonly");
 $("#id").attr("readonly", "readonly"); ----- $("#id").removeAttr("readonly");
 $("#Form :input").attr("readonly", "readonly"); //对form里面的禁用
 $("input").attr("readonly", "readonly"); //对所有的input标签禁用

2.combobox禁用启用用法:

$("#id").combobox({ disabled: true }); ----- $("#id").combobox({ disabled: false});
 $("#id").attr("readonly", "readonly"); //对单个禁用 ----- $("#id").removeAttr("readonly");
 $("#fm .easyui-combobox").combobox({ disabled: true }); //对form里面的下拉框禁用
 $("#ID").combobox("disable"); ------ $("#ID").combobox("enable");

3.datebox与datetimebox禁用启用方法:

$("#fm .easyui-datebox").datebox({ disabled: true }); ----- $("#fm .easyui-datebox").datebox({ disabled: false});
 $("#id").attr("readonly", "readonly"); ----- $("#id").removeAttr("readonly");
 $("#fm .easyui-datetimebox").datetimebox({ disabled: true }); ----- $("#fm .easyui-datetimebox").datetimebox({ disabled: true });

4.还有一种比较投机取巧的方法,但是也可以用    例子如下:

<div id=" divParent"style="margin:10px 0;"> 
<input id='test' class="easyui-datebox" ></input></div>

现在我要隐藏那个input ,既然不兼容,那我就隐藏他父元素。

$("#divParent" ).css("display", "none");

以下是设置不可用的方法:

$("#test").datebox({ 
  disabled: true 
 });
Javascript 相关文章推荐
javascript模拟实现C# String.format函数功能代码
Nov 25 Javascript
js获取判断上传文件后缀名的示例代码
Feb 19 Javascript
JavaScript实现控制打开文件另存为对话框的方法
Apr 17 Javascript
Extjs4.0 ComboBox如何实现三级联动
May 11 Javascript
浅谈js的url解析函数封装
Jun 28 Javascript
JS中的phototype详解
Feb 04 Javascript
使用jQuery实现动态添加小广告
Jul 11 jQuery
jQuery简单实现的HTML页面文本框模糊匹配查询功能完整示例
May 09 jQuery
vue 实现axios拦截、页面跳转和token 验证
Jul 17 Javascript
JS实现全屏预览F11功能的示例代码
Jul 23 Javascript
vue中更改数组中属性,在页面中不生效的解决方法
Oct 30 Javascript
extjs图表绘制之条形图实现方法分析
Mar 06 Javascript
vue-cli+webpack在生成的项目中使用bootstrap实例代码
May 26 #Javascript
BootStrap中的Fontawesome 图标
May 25 #Javascript
Vue.js 中的 $watch使用方法
May 25 #Javascript
详解Javascript获取缓存和清除缓存API
May 25 #Javascript
Angularjs 实现动态添加控件功能
May 25 #Javascript
JavaScript实现自动跳转文本功能
May 25 #Javascript
angularjs项目的页面跳转如何实现(5种方法)
May 25 #Javascript
You might like
php 过滤危险html代码
2009/06/29 PHP
laravel框架上传图片实现实时预览功能
2019/10/14 PHP
[原创]提供复制本站内容时出现,该文章转自脚本之家等字样的js代码
2007/03/27 Javascript
javascript 无提示关闭窗口脚本
2009/08/17 Javascript
div层的移动及性能优化
2010/11/16 Javascript
通过JavaScript控制字体大小的代码
2011/10/04 Javascript
js调用iframe实现打印页面内容的方法
2014/03/04 Javascript
jQuery的ready方法详解
2014/11/27 Javascript
QQ登录背景闪动效果附效果演示源码下载
2015/09/22 Javascript
JavaScript数据结构与算法之链表
2016/01/29 Javascript
详解JavaScript异步编程中jQuery的promise对象的作用
2016/05/03 Javascript
Javascript中document.referrer隐藏来源的方法
2017/01/16 Javascript
jQuery实现仿京东防抖动菜单效果示例
2018/07/06 jQuery
JavaScript之解构赋值的理解
2019/01/30 Javascript
JS中的算法与数据结构之常见排序(Sort)算法详解
2019/08/16 Javascript
基于Vue的商品主图放大镜方案详解
2019/09/19 Javascript
关于引入vue.js 文件的知识点总结
2020/01/28 Javascript
jquery实现直播视频弹幕效果
2020/02/25 jQuery
vue全局使用axios的操作
2020/09/08 Javascript
Python实现Tab自动补全和历史命令管理的方法
2015/03/12 Python
Python中Selenium模拟JQuery滑动解锁实例
2017/07/26 Python
Python面向对象程序设计OOP深入分析【构造函数,组合类,工具类等】
2019/01/05 Python
tensorflow模型文件(ckpt)转pb文件的方法(不知道输出节点名)
2020/04/22 Python
Python偏函数Partial function使用方法实例详解
2020/06/17 Python
Python3爬虫关于代理池的维护详解
2020/07/30 Python
餐饮业创业计划书范文
2014/01/06 职场文书
问卷调查计划书
2014/01/10 职场文书
《大海那边》教学反思
2014/04/09 职场文书
公司收款委托书范本
2014/09/20 职场文书
党员个人整改方案及措施
2014/10/25 职场文书
新闻报道稿范文
2015/07/23 职场文书
适合毕业生创业的项目怎么找?
2019/08/08 职场文书
使用Spring处理x-www-form-urlencoded方式
2021/11/02 Java/Android
《地。-关于地球的运动-》单行本第七集上市,小说家朝井辽献上期待又害怕的推荐文
2022/03/31 日漫
《勇者辞职不干了》ED主题曲无字幕动画MV公开
2022/04/13 日漫
Moment的feature导致线上bug解决分析
2022/09/23 Javascript