首页 > 代码库 > JQuery 设置checkbox select radio 为“只读”

JQuery 设置checkbox select radio 为“只读”

2024-07-10 13:32:14   224人阅读

 

JQuery  设置checkbox select radio 为“只读”，通过测试知道使用HTML标签的 text 和 textarea 、button 可以设置readonly="readonly"属性。

但是checkbox 、select、 radio 这三个控件使用起来不能使用readonly="readonly"属性，只有 disabled="disabled"可以使用。

这样就出现问题了。又想不让修改，又想在后台获取值。如果使用disabled属性，但是发现(string value = http://www.mamicode.com/Request.Form["XX"];)值为空。

不想修改后台代码，最后在和博哥的讨论之下，终于想出了下面的方法。

[html] view plaincopyprint?
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>  
  2.   
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  4. <html xmlns="http://www.w3.org/1999/xhtml">  
  5. <head runat="server">  
  6.     <title></title>  
  7.     <script src=http://www.mamicode.com/"Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>  
  8.     <script type="text/javascript">  
  9.         function setSCR_ReadOnly() {  
  10.             var items = $("input[type=‘checkbox‘]")  
  11.             var html = ""  
  12.             for (var i = 0; i < items.length; i++) {  
  13.                 items[i].disabled = true;  
  14.                 html += "<input type=‘text‘ name=‘" + items[i].id + "‘ value=http://www.mamicode.com/‘" + items[i].value + "‘>";  
  15.             }  
  16.   
  17.             var items = $("select");  
  18.             for (var i = 0; i < items.length; i++) {  
  19.                 html += "<input type=‘text‘ name=‘" + items[i].id + "‘ value=http://www.mamicode.com/‘" + items[i].value + "‘>";  
  20.                 items[i].disabled = true;  
  21.             }  
  22.   
  23.             var items = $(":radio");  
  24.             for (var i = 0; i < items.length; i++) {  
  25.                 html += "<input type=‘text‘ name=‘" + items[i].id + "‘ value=http://www.mamicode.com/‘" + items[i].value + "‘>";  
  26.                 items[i].disabled = true;  
  27.             }  
  28.             $("#divhtml").html(html);  
  29.   
  30.   
  31.         }  
  32.     </script>  
  33. </head>  
  34. <body>  
  35.     <form id="form1" runat="server">  
  36.     <div>  
  37.         <input type="text" readonly="readonly" />  
  38.         <input  type="button" value=http://www.mamicode.com/"不可用" onclick="setSCR_ReadOnly()" />  
  39.         <input  type="checkbox" id="r" checked="checked" runat="server" value=http://www.mamicode.com/"cboVAlue" />  
  40.         <select  id="sel" name="sel">  
  41.             <option value=http://www.mamicode.com/"请选择">请选择</option>  
  42.             <option value=http://www.mamicode.com/"1">1</option>  
  43.         </select>  
  44.         <select id="Select1" name="Select1">  
  45.             <option value=http://www.mamicode.com/"请选择">请选择</option>  
  46.             <option value=http://www.mamicode.com/"1" selected="selected">1</option>  
  47.         </select>  
  48.         <input  id="rdo" name="rdo" type="radio" value=http://www.mamicode.com/"1" checked="checked" />  
  49.         <asp:Button runat="server" Text="Button" onclick="Unnamed1_Click" />  
  50.         <div style="display: none" id="divhtml">  
  51.         </div>  
  52.     </div>  
  53.     </form>  
  54. </body>  
  55. </html>  
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <title></title>    <script src="http://www.mamicode.com/Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>    <script type="text/javascript">        function setSCR_ReadOnly() {            var items = $("input[type=‘checkbox‘]")            var html = ""            for (var i = 0; i < items.length; i++) {                items[i].disabled = true;                html += "<input type=‘text‘ name=‘" + items[i].id + "‘ value=http://www.mamicode.com/‘" + items[i].value + "‘>";            }            var items = $("select");            for (var i = 0; i < items.length; i++) {                html += "<input type=‘text‘ name=‘" + items[i].id + "‘ value=http://www.mamicode.com/‘" + items[i].value + "‘>";                items[i].disabled = true;            }            var items = $(":radio");            for (var i = 0; i < items.length; i++) {                html += "<input type=‘text‘ name=‘" + items[i].id + "‘ value=http://www.mamicode.com/‘" + items[i].value + "‘>";                items[i].disabled = true;            }            $("#divhtml").html(html);        }    </script></head><body>    <form id="form1" runat="server">    <div>        <input type="text" readonly="readonly" />        <input  type="button" value="http://www.mamicode.com/不可用" onclick="setSCR_ReadOnly()" />        <input  type="checkbox" id="r" checked="checked" runat="server" value="http://www.mamicode.com/cboVAlue" />        <select  id="sel" name="sel">            <option value="http://www.mamicode.com/请选择">请选择</option>            <option value="http://www.mamicode.com/1">1</option>        </select>        <select id="Select1" name="Select1">            <option value="http://www.mamicode.com/请选择">请选择</option>            <option value="http://www.mamicode.com/1" selected="selected">1</option>        </select>        <input  id="rdo" name="rdo" type="radio" value="http://www.mamicode.com/1" checked="checked" />        <asp:Button runat="server" Text="Button" onclick="Unnamed1_Click" />        <div style="display: none" id="divhtml">        </div>    </div>    </form></body></html>
将这些控件设置为disabled以后，发现这些控件就可以获取值。
[csharp] view plaincopyprint?
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Web;  
  5. using System.Web.UI;  
  6. using System.Web.UI.WebControls;  
  7.   
  8. public partial class _Default : System.Web.UI.Page  
  9. {  
  10.     protected void Page_Load(object sender, EventArgs e)  
  11.     {  
  12.          
  13.     }  
  14.     protected void Unnamed1_Click(object sender, EventArgs e)  
  15.     {  
  16.         string value = Request.Form["r"];  
  17.         string q = Request.Form["sel"];  
  18.         string s = Request.Form["Select1"];  
  19.         string w = Request.Form["rdo"];  
  20.     }  
  21. }  


联系
我们