您現(xiàn)在的位置： 365建站網(wǎng) > 365文章 > 區(qū)別Web文本框和HTML文本框的RandOnly、Disabled

區(qū)別Web文本框和HTML文本框的RandOnly、Disabled

文章來源：365jz.com 點擊數(shù)：403 更新時間：2011-01-29 09:34 參與評論

使用ReadOnly和Enable（HTML控件：Disabled）都能使用戶不能夠更改內(nèi)容，二者區(qū)別是：

1、Readonly只針對input(text/password)和textarea有效，而disabled對于所有的表單元素有效，包括select，radio,checkbox,button等。

2、在表單元素使用了disabled后，我們將表單以POST或者GET的方式提交的話，這個元素的值不會被傳遞出去，而readonly會將該值傳遞出去。

需要一個這樣的文本框，不能手工更改內(nèi)容，但JS可以，也可以回傳。

在頁面添加一個Web文本框控件（asp:TextBox），設置為readonly，以為大功告成，誰知道一點擊回發(fā)，文本框中的內(nèi)容還是之前的，沒改變。于是取消readonly，通過不可焦距、剪切、粘貼等方法讓用戶不可更改內(nèi)容，弄出了一個假的不可編輯，哈哈，還挺滿足的！

今日得閑，寫下如下代碼測試。

代碼

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Register Src="~/UC/XwTreeDropDownList/XwTreeDropDownList.ascx" TagPrefix="uc"
    TagName="XwTreeDropDownList" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <table style="width: 100%;">
        <tr>
            <td>
                &nbsp;
            </td>
            <td>
                newReadOnly
            </td>
            <td>
                ReadOnly
            </td>
            <td>
                Disabled
            </td>
        </tr>
        <tr>
            <td>
                asp:TextBox
            </td>
            <td>
                <asp:TextBox ID="txtNewReadOnly1" runat="server" onfocus="this.blur();" onpaste="return false"
                    oncut="return false" Text="txtNewReadOnly1"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="txtReadOnly1" runat="server" ReadOnly="true" Text="txtReadOnly1"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="txtDisabled1" runat="server" Enabled="false" Text="txtDisabled1"></asp:TextBox>
            </td>
        </tr>
        <tr>
            <td>
                input:Text
            </td>
            <td>
                <input runat="server" id="txtNewReadOnly2" type="text" onfocus="this.blur();" onpaste="return false"
                    oncut="return false" value="txtNewReadOnly2" />
            </td>
            <td>
                <input runat="server" id="txtReadOnly2" type="text" readonly="readonly" value="txtReadOnly2" />
            </td>
            <td>
                <input runat="server" id="txtDisabled2" type="text" disabled="disabled" value="txtDisabled2" />
            </td>
        </tr>
    </table>
    <asp:Button ID="Button1" runat="server" Text="回發(fā)" OnClick="Button1_Click" />
    <input id="Button2" type="button" value="JS設置值" onclick="changeTxtValue();" />
    </form>
</body>
</html>

<script type="text/javascript">
    function changeTxtValue() {
        document.getElementById('txtNewReadOnly1').value = "txtNewReadOnly1" + new Date().getTime();
        document.getElementById('txtReadOnly1').value = "txtReadOnly1" + new Date().getTime();
        document.getElementById('txtDisabled1').value = "txtDisabled1" + new Date().getTime()
        document.getElementById('txtNewReadOnly2').value = "txtNewReadOnly2" + new Date().getTime();
        document.getElementById('txtReadOnly2').value = "txtReadOnly2" + new Date().getTime();
        document.getElementById('txtDisabled2').value = "txtDisabled2" + new Date().getTime()
    }
</script>

代碼

        protected void Button1_Click( object sender, EventArgs e )
        {
            Response.Write( "asp:TextBox<br/>" );
            Response.Write( string.Format( "txtNewReadOnly1: {0}<br/>", Request.Form[ "txtNewReadOnly1" ] ) );
            Response.Write( string.Format( "txtReadOnly1: {0}<br/>", Request.Form[ "txtReadOnly1" ] ) );
            Response.Write( string.Format( "txtDisabled1: {0}<br/>", Request.Form[ "txtDisabled1" ] ) );

            Response.Write( "<br/>" );

            Response.Write( "input:text<br/>" );
            Response.Write( string.Format( "txtNewReadOnly2: {0}<br/>", Request.Form[ "txtNewReadOnly2" ] ) );
            Response.Write( string.Format( "txtReadOnly2: {0}<br/>", Request.Form[ "txtReadOnly2" ] ) );
            Response.Write( string.Format( "txtDisabled2: {0}<br/>", Request.Form[ "txtDisabled2" ] ) );
        }