给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 相关文章推荐
event.keyCode键码值表 附只能输入特定的字符串代码
May 15 Javascript
javascript 面向对象,实现namespace,class,继承,重载
Oct 29 Javascript
基于jQuery的星级评分插件
Aug 12 Javascript
JavaScript入门之对象与JSON详解
Oct 21 Javascript
jquery星级插件、支持页面中多次使用
Mar 25 Javascript
jquery submit ie6下失效的原因分析及解决方法
Nov 15 Javascript
基于JS组件实现拖动滑块验证功能(代码分享)
Nov 18 Javascript
JS数字千分位格式化实现方法总结
Dec 16 Javascript
jQuery插件开发发送短信倒计时功能代码
May 09 jQuery
JavaScript栈和队列相关操作与实现方法详解
Dec 07 Javascript
微信小程序学习笔记之表单提交与PHP后台数据交互处理图文详解
Mar 28 Javascript
js中addEventListener()与removeEventListener()用法案例分析
Mar 02 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
模仿OSO的论坛(一)
2006/10/09 PHP
php smarty函数扩展
2010/03/15 PHP
PHP文章按日期(月日)SQL归档语句
2012/11/29 PHP
php curl 获取https请求的2种方法
2015/04/27 PHP
yii2中LinkPager增加总页数和总记录数的实例
2017/08/28 PHP
php strftime函数的详细用法
2018/06/21 PHP
PDO::quote讲解
2019/01/29 PHP
Javascript的IE和Firefox兼容性汇编(zz)
2007/02/02 Javascript
jQuery学习3:操作元素属性和特性
2010/02/07 Javascript
设置checkbox为只读(readOnly)的两种方式
2013/10/11 Javascript
jquery submit ie6下失效的原因分析及解决方法
2013/11/15 Javascript
JS组件Form表单验证神器BootstrapValidator
2016/01/26 Javascript
js判断图片加载完成后获取图片实际宽高的方法
2016/02/25 Javascript
分享JavaScript监听全部Ajax请求事件的方法
2016/08/28 Javascript
初识简单却不失优雅的Vue.js
2016/09/12 Javascript
jquery实现拖动效果(代码分享)
2017/01/25 Javascript
vue组件间的参数传递实例详解
2019/04/26 Javascript
vue+egg+jwt实现登录验证的示例代码
2019/05/18 Javascript
js实现简单的日历显示效果函数示例
2019/11/25 Javascript
深入理解webpack process.env.NODE_ENV配置
2020/02/23 Javascript
JS Generator 函数的含义与用法实例总结
2020/04/08 Javascript
js实现搜索提示框效果
2020/09/05 Javascript
Python中执行存储过程及获取存储过程返回值的方法
2017/10/07 Python
如何在django里上传csv文件并进行入库处理的方法
2019/01/02 Python
浅谈python3.x pool.map()方法的实质
2019/01/16 Python
tensorflow实现在函数中用tf.Print输出中间值
2020/01/21 Python
opencv python 图片读取与显示图片窗口未响应问题的解决
2020/04/24 Python
使用opencv中匹配点对的坐标提取方式
2020/06/04 Python
基于Python3读写INI配置文件过程解析
2020/07/23 Python
HTML5之SVG 2D入门6—视窗坐标系与用户坐标系及变换概述
2013/01/30 HTML / CSS
html5借用repeating-linear-gradient实现一把刻度尺(ruler)
2019/09/09 HTML / CSS
ECCO英国官网:丹麦鞋履品牌
2019/09/03 全球购物
党员查摆四风问题思想汇报
2014/10/25 职场文书
运动会主持词大全
2015/07/02 职场文书
详解Redis集群搭建的三种方式
2021/05/31 Redis
mysql的Buffer Pool存储及原理
2022/04/02 MySQL