给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 相关文章推荐
JS中剪贴板兼容性、判断复制成功或失败
Mar 09 Javascript
js自定义事件代码说明
Jan 31 Javascript
JavaScript实现两个Table固定表头根据页面大小自行调整
Jan 03 Javascript
自己使用jquery写的一个无缝滚动的插件
Apr 30 Javascript
一个不错的js html页面倒计时可精确到秒
Oct 22 Javascript
js控制网页背景音乐播放与停止的方法
Feb 06 Javascript
使用JavaScript实现旋转的彩圈特效
Jun 23 Javascript
jQuery Chosen通用初始化
Mar 07 Javascript
JavaScript通过mouseover()实现图片变大效果的示例
Dec 20 Javascript
vue 使用eventBus实现同级组件的通讯
Mar 02 Javascript
原生JS实现的雪花飘落动画效果
May 03 Javascript
webpack+vue+express(hot)热启动调试简单配置方法
Sep 19 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
MySQL授权问题总结
2007/05/06 PHP
fleaphp crud操作之findByField函数的使用方法
2011/04/23 PHP
php简单对象与数组的转换函数代码(php多层数组和对象的转换)
2011/05/18 PHP
PHP基于ICU扩展intl快速实现汉字转拼音及按拼音首字母分组排序的方法
2017/05/03 PHP
PHP中16个高危函数整理
2019/09/19 PHP
禁止刷新,回退的JS
2006/11/25 Javascript
基于Jquery 解决Ajax请求的页面 浏览器后退前进功能,页面刷新功能实效问题
2010/12/11 Javascript
JQuery中Ajax()的data参数类型实例分析
2015/12/15 Javascript
利用BootStrap弹出二级对话框的简单实现方法
2016/09/21 Javascript
javaScript 事件绑定、事件冒泡、事件捕获和事件执行顺序整理总结
2016/10/10 Javascript
深入理解jquery中的each用法
2016/12/14 Javascript
详解JS对象封装的常用方式
2016/12/30 Javascript
JavaScript实现百度搜索框效果
2020/03/26 Javascript
Vue中对比scoped css和css module的区别
2018/05/17 Javascript
详解如何为你的angular app构建一个第三方库
2018/12/07 Javascript
html-webpack-plugin修改页面的title的方法
2020/06/18 Javascript
antd配置config-overrides.js文件的操作
2020/10/31 Javascript
Python输出汉字字库及将文字转换为图片的方法
2016/06/04 Python
Pyhton中单行和多行注释的使用方法及规范
2016/10/11 Python
python实现机器学习之元线性回归
2018/09/06 Python
Python3实现腾讯云OCR识别
2018/11/27 Python
Python实现微信自动好友验证,自动回复,发送群聊链接方法
2019/02/21 Python
Python3进制之间的转换代码实例
2019/08/24 Python
python实现串口通信的示例代码
2020/02/10 Python
python圣诞树编写实例详解
2020/02/13 Python
如何利用python发送邮件
2020/09/26 Python
利用CSS3把图片变成灰色模式的实例代码
2016/09/06 HTML / CSS
JavaScript+Canvas实现自定义画板的示例代码
2019/05/13 HTML / CSS
.NET概念性的面试题
2012/02/29 面试题
毕业求职自荐信格式是什么
2013/11/19 职场文书
大四毕业生自荐书
2014/07/05 职场文书
2015年超市工作总结范文
2015/05/26 职场文书
工人先锋号事迹材料(2016精选版)
2016/03/01 职场文书
世界上超棒的8种逻辑思维
2019/08/06 职场文书
Python pygame实现中国象棋单机版源码
2021/06/20 Python
Python学习之时间包使用教程详解
2022/03/21 Python