好的,作为服务器开发人员,在客户端呈现的 ASP.NET 页面(基于母版页)上的这个 Javascript 巫毒对我来说有点太多了,看起来 :-)
我决定尝试使用 jQuery 来处理一些客户端启用和禁用 UI 元素。
我有两个单选按钮(rbnDoLimit
和rbnDontLimit
)和三个复选框(months12
、months24
、months36
)——如果我点击rbnDoLimit
,我想启用所有三个,如果我点击rbnDontLimit
,我想清除和禁用这三个复选框。看起来很简单,对吧?
所以我下载了 jQuery 1.3.2 并将其包含在我的 ASP.NET 3.5 网络表单中——工作正常,我可以在 $(document).ready 事件上显示“警报”。
我的两个单选按钮在页面中呈现为:
<input id="ctl01_cphContent_pnlBasicInfo_rbnDontLimit"
type="radio" name="ctl01$cphContent$pnlBasicInfo$LimitMVD"
value="False" checked="checked" />
<input id="ctl01_cphContent_pnlBasicInfo_rbnDoLimit"
type="radio" name="ctl01$cphContent$pnlBasicInfo$LimitMVD"
value="True" />
我的三个复选框为:
<span class="dcDetails"><input id="ctl01_cphContent_pnlBasicInfo_months12"
type="checkbox" name="ctl01$cphContent$pnlBasicInfo$months12" /></span>
<span class="dcDetails"><input id="ctl01_cphContent_pnlBasicInfo_months24"
type="checkbox" name="ctl01$cphContent$pnlBasicInfo$months24" /></span>
<span class="dcDetails"><input id="ctl01_cphContent_pnlBasicInfo_months36"
type="checkbox" name="ctl01$cphContent$pnlBasicInfo$months36" /></span>
我用 CSS 类装饰它们dcDetails
(它不存在 - 但旨在用于在 jQuery 中选择它们)。<input>
我注意到的第一件事是 CSS 类没有按预期应用于我的元素,而是应用于......<span>
周围的元素<input>
(对我来说第一个谜......)。反正.....
我的第一次 jQuery 尝试如下所示:
<script type="text/javascript">
$(document).ready(
$("#<%= rbnDontLimit.ClientID %>").click(function() {
$(".dcDetails").attr('disabled','false');
},
$("#<%= rbnDoLimit.ClientID %>").click(function() {
$(".dcDetails").attr('disabled','true');
});
</script>
没有运气 - 我可以随意点击两个单选按钮 - 没有任何反应。我认为这是因为dcDetails
CSS 类位于<span>
复选框周围,对吧?
好的 - 所以它变得有点混乱,但这应该工作!现在我正在专门选择三个复选框ClientID
,我认为这应该是准确的并且得到正确的元素:
<script type="text/javascript">
$(document).ready(
$("#<%= rbnDontLimit.ClientID %>").click(function() {
$("#<%= months12.ClientID %>").attr('disabled','false');
$("#<%= months24.ClientID %>").attr('disabled','false');
$("#<%= months36.ClientID %>").attr('disabled','false');
},
$("#<%= rbnDoLimit.ClientID %>").click(function() {
$("#<%= months12.ClientID %>").attr('disabled','true');
$("#<%= months24.ClientID %>").attr('disabled','true');
$("#<%= months36.ClientID %>").attr('disabled','true');
});
</script>
再次,没有运气......
那我到底错过了什么?所有这些很棒的时髦演示似乎都无法帮助我理解为什么这不起作用——甚至一点都没有……我想我错过了一些非常基本、非常基础的东西——但我似乎无法弄清楚出来,那是什么!:-)
马克
更新:
还没有多少运气 :-( 我将我的示例剥离到一个准系统 HTML 页面 - 但我一遍又一遍地遇到这个错误,无论我尝试哪种各种技巧:
网页错误详情
消息:对象不支持此属性或方法行:3032 字符:6 代码:0 URI:file:///D:/projects/JQuery1/jquery-1.3.2.js
几乎似乎是 jQuery 内部的一个错误.......有什么想法吗?
更新 2:
我开始认为我在这里做的事情根本上是错误的......我假设在 document.ready() 函数中,我可以连接两个单选按钮上的点击事件。我在这里错过了什么吗?我是否需要创建一个从单选按钮的客户端“点击”事件调用的函数?无论我想做什么,即使在我的 HTML 编辑器(TopStyle 4)中——这个错误“对象不支持这个属性或方法”一直在弹出——方便地既不告诉我它指的是哪个对象,也不告诉我我不支持什么属性或方法............
还是我试图在 document.ready() 中连接两个单击事件处理函数时做错了什么?
任何可能感兴趣的人都可以在http://jquery.bluenose.ch/jquerydemo.html上找到按比例缩小的纯 HTML 版本- 我希望能够单击“Do Limit”单选按钮并让它禁用它下面的三个复选框 - 不行:-(