一、設(shè)置HTML表單文本框為只讀的幾種方式

有時候，我們希望表單中的文本框是只讀的，讓用戶只能查看信息而不能修改其中的信息，使 input type=”text” name=”input” value=”HTML” 的內(nèi)容中value得值，就是”HTML”不可以修改。實現(xiàn)的方式有如下幾種。 

方法一：修改 onfocus 參數(shù)為 this.blur()

<input type="text" name="input" value="HTML" onfocus=this.blur()>

方法二：添加 readonly 參數(shù)

<input type="text" name="input" value="HTML" readonly>
<input type="text" name="input" value="HTML" readonly="true">

方法三：添加 disabled 參數(shù)

<input type="text" name="input" value="HTML" disabled>

二、jquery將text文本框設(shè)置為只讀

$("#c_price").attr("readonly",true);

三、css控制文本框的只讀屬性的方法

css 封裝整個只讀文本框的屬性:

.TextBoxReadOnly
{
border:1px solid #C0C0C0;
text-align:left;
background-color:#D3D3D3;
width:100px;
readonly:expression(this.readOnly=true);
}

它工作得很好, 經(jīng)過測試, 發(fā)現(xiàn)了一個問題: 
用js 代碼: txt.readOnly=false , 不能使文本框回到可讀寫狀態(tài), 用:

txt.className="OtherStyle";
txt.readOnly=false;
也不行! 
總之, 一旦使用css 修飾了該控件使它只讀, 就不能再使它恢復(fù)到可讀寫的狀態(tài)了. 即使換成其它的css 樣式, 有知道的朋友，請告知下哦。.

于是乎, 又寫了一個樣式:

.TextBoxReadWrite
{
border:1px solid #C0C0C0;
text-align:left;
background-color:#FFFFFF;
width:100px;
readonly:expression(this.readOnly=false);
}

這樣再用js 切換樣式, 就可以在只讀與可讀寫之間來回切換了, 把這個過程封裝到一個函數(shù)中, 在程序中就可以自由調(diào)用了, 雖然有點繞, 不過是目前我找到的最好的辦法.

切換的js:

function f1(ctr,isReadOnly)
{
var octr=document.getElementById(ctr);
if(octr!=null)
{
if(isReadOnly)
octr.className="TextBoxReadOnly";
else
octr.className="TextBoxReadWrite";
}
}

調(diào)用:

function f3()
{
f1("<%=txt1.ClientID %>",true);
}

• 文本框
• 只讀