Easyui-Datebox設定隱藏或不可用如何解決-js教程-PHP中文網

Easyui-Datebox設定隱藏或不可用如何解決

小云云

發布： 2018-01-10 13:18:59

原創

2704 人瀏覽過

本文主要為大家介紹下給Easyui-Datebox設定隱藏或不可用的解決方法，是因為最近在做一個安全監測系統，選擇了用easyui進行搭建，easyui是一種基於jQuery的用戶界面插件集合。使用easyui可以省去很多程式碼，功能上需要加一些樣式。

我們公司做的是一套安全監測系統。所以呢對於前台頁面沒有像一些入口網站佈局那麼豐富，特效特別炫。目前只需要一套簡單的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.還有一個比較投機取巧的方法，但也可以用範例如下：

<p id=" pParent"style="margin:10px 0;"> 
<input id=&#39;test&#39; class="easyui-datebox" ></input></p>

登入後複製

現在我要隱藏那個input ，既然不相容，那我就隱藏他父元素。

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

登入後複製

以下是設定不可用的方法：

$("#test").datebox({ 
  disabled: true 
 });

登入後複製