如题，在页面中有一个checkbox和一个textbox,我想当checkbox勾上的时候textbox可以输入，不勾的时候就readonly, 如何利用javascript实现?(checkbox 不是服务器控件 )
------解决方案--------------------------------------------------------
- JScript code
<script type="text/javascript"> $(document).ready(function () { $("#ckbox").click(function () { if ($("#ckbox").attr("checked")) { $("#txt").attr("readonly", "readonly"); } else { $("#txt").removeAttr("readonly"); } }); }); </script>
------解决方案--------------------------------------------------------
- HTML code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default5.aspx.cs" Inherits="_20120301_Default5" %><!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="../jquery-1.3.2-vsdoc.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $("#Checkbox1").click(function(){ if($(this).attr("checked") == true) { $("#Text1").attr("readonly","readonly"); } else { $("#Text1").attr("readonly",""); } }); }); </script> </head><body> <form id="form1" runat="server"> <div> <input id="Checkbox1" type="checkbox" /> <input id="Text1" type="text" /> </div> </form></body></html>
------解决方案--------------------------------------------------------
这个，2楼给的反了
- HTML code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default5.aspx.cs" Inherits="_20120301_Default5" %><!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="../jquery-1.3.2-vsdoc.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $("#Checkbox1").click(function(){ if($(this).attr("checked") == true) { $("#Text1").attr("readonly",""); } else { $("#Text1").attr("readonly","readonly"); } }); }); </script> </head><body> <form id="form1" runat="server"> <div> <input id="Checkbox1" type="checkbox" /> <input id="Text1" type="text" readonly="readonly"/> </div> </form></body></html>
------解决方案--------------------------------------------------------
不用JQuery，用JS的方法
- HTML code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default5.aspx.cs" Inherits="_20120301_Default5" %><!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 type="text/javascript"> function testFunc() { if(document.getElementById("Checkbox1").checked == true) { document.getElementById("Text1").readOnly = false; } else { document.getElementById("Text1").readOnly = true; } } </script></head><body> <form id="form1" runat="server"> <div> <input id="Checkbox1" type="checkbox" onclick="testFunc();" /> <input id="Text1" type="text" readonly="readonly" /> </div> </form></body>