使用ASP.NET WebForms的jQuery，用于一个糟糕的旧服务器开发人员

好的，作为一名服务器开发人员，在客户端呈现的ASP.NET页面（基于母版页）上的Javascript voodoo对我来说有点太多了，似乎：-）

我决定尝试使用jQuery来处理一些客户端UI元素的启用和禁用

我有两个单选按钮（

rbnDoLimit

和

rbnDoLimit

）和三个复选框（

months12

，

months24

，

months36

）-如果我单击

rbnDoLimit

，我想启用这三个复选框，如果我单击

rbnDoLimit

，我想清除并禁用这三个复选框。看起来很简单，对吧

因此，我下载了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" />

不走运-我可以点击两个单选按钮-什么都没有发生。我假设这是因为

dcDetails

CSS类位于复选框周围的

上，对吗

好的-所以它变得有点混乱，但这应该会起作用！！现在，我具体地选择了三个复选框，通过它们的

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>

$（文件）。准备好了吗(
$（“#”）单击（函数（）{
$（“#”）attr（'disabled'，'false'）；
$（“#”）attr（'disabled'，'false'）；
$（“#”）attr（'disabled'，'false'）；
},
$（“#”）单击（函数（）{
$（“#”）attr（'disabled'，'true'）；
$（“#”）attr（'disabled'，'true'）；
$（“#”）attr（'disabled'，'true'）；
});

再一次，没有运气

那么，我到底错过了什么呢？所有这些出色的时髦演示似乎都无法帮助我理解为什么这不起作用——甚至一点都没有……我想我错过了一些非常基本、非常基本的东西——但我似乎无法理解，那是什么！：-）

马克

更新：
还没有太多的运气：-（我把我的示例剥离到一个简单的HTML页面上-但是我一次又一次地出现这个错误，不管我尝试了以下哪种技巧：

网页错误详细信息

消息：对象不支持此属性或方法 电话号码：3032 字符：6 代码：0 URI:file:///D:/projects/JQuery1/jquery-1.3.2.js

几乎似乎是jQuery内部的一个错误……有什么想法吗

更新2:
我开始认为我在这里做了一些根本错误的事情……我假设在document.ready（）函数中，我可以连接两个单选按钮上的单击事件。我在这里遗漏了什么吗？我需要创建一个从单选按钮的客户端“单击”调用的函数吗事件？无论我想做什么，即使在我的HTML编辑器（TopStyle 4）中，这个错误“对象不支持此属性或方法”总是出现-方便地既不告诉我它引用了哪个对象，也不告诉我不支持哪个属性或方法

或者我在尝试连接document.ready（）中的两个单击事件处理程序函数时出错了

对于可能感兴趣的任何人，都可以在上获得缩小的HTML版本-我希望能够单击“Do Limit”单选按钮并使其禁用下面的三个复选框-禁止：-（

尝试更改：

$("#<%= months12.ClientID %>").attr('disabled','false')

$（“#”）attr（'disabled'，'false'））

致：

$（“#”）attr（'disabled'，'disabled'）

及

$（“#”）attr（'disabled'，'true'））

致：

$（“#”）attr（'disabled'，''）

使用Kieron的答案，然后

$("#<%= rbnDontLimit.ClientID %>").click(function() {
            $(".dcDetails").attr('disabled','false'); 
}

$（“#”）点击（函数（）{
$（“.dcDetails”）.attr（'disabled'，'false'）；
}

也可以更改为：

$("#<%= rbnDontLimit.ClientID %>").click(function() {
            $(".dcDetails > :checkbox").attr('disabled','disabled'); 
}

$（“#”）点击（函数（）{
$（“.dcDetails>：复选框”）.attr（'disabled'，'disabled'）；
}

要禁用复选框（任何控件），我使用以下命令

$("#chkSomething").attr("disabled", "true")

$("#chkSomething").removeAttr("disabled")

要启用复选框（任何控件），我使用以下命令

$("#chkSomething").attr("disabled", "true")

$("#chkSomething").removeAttr("disabled")

回答你的问题,

<script type="text/javascript">
    $(document).ready(
        $("#<%= rbnDontLimit.ClientID %>").click(function() {
            $("#<%= months12.ClientID %>").removeAttr("disabled"); 
            $("#<%= months24.ClientID %>").removeAttr("disabled"); 
            $("#<%= months36.ClientID %>").removeAttr("disabled"); 
        },
        $("#<%= rbnDoLimit.ClientID %>").click(function() {
            $("#<%= months12.ClientID %>").attr('disabled','true'); 
            $("#<%= months24.ClientID %>").attr('disabled','true'); 
            $("#<%= months36.ClientID %>").attr('disabled','true'); 
        });
</script>

$（文件）。准备好了吗(
$（“#”）单击（函数（）{
$（“#”）.removeAttr（“禁用”）；
$（“#”）.removeAttr（“禁用”）；
$（“#”）.removeAttr（“禁用”）；
},
$（“#”）单击（函数（）{
$（“#”）attr（'disabled'，'true'）；
$（“#”）attr（'disabled'，'true'）；
$（“#”）attr（'disabled'，'true'）；
});

我查看了您的示例，发现有一些语法问题

你的例子是：

 $(document).ready(
    $('#rbnDontLimit').click(function() {
        $(".dcDetails :input").removeAttr('disabled');
    }),
    $("#rbnDoLimit").click(function() {
        $('.dcDetails :input').attr('disabled', 'true');
    }));

您缺少ready后面的“function（）{”，以及末尾对应的“}”。 to click事件之间的逗号应为分号。 从jQuery选择器中删除“：input”。 这应该适合您：

   $(document).ready(function() {
        $('#rbnDontLimit').click(function() {
            $(".dcDetails").removeAttr('disabled');
        });
        $("#rbnDoLimit").click(function() {
            $('.dcDetails').attr('disabled', true);
        });
    });

---

也许有更好的方法，但我很确定它会起作用/：看起来没有任何变化，对不起；-（只要我点击两个单选按钮，什么都不会发生……复选框保持不变……在事件中，添加：alert（$（“#”）。length）；这将提醒jQuery找到的与您的选择器匹配的元素数-可能是选择器不匹配…您也可以尝试用jQuery替换$…有时其他库（如ASP.NET AJAX）会覆盖它…@Kieron:不走运，我没有进展…JS错误说“对象不支持属性或方法”-是否“radio”输入元素没有“.click”方法？或者它被称为其他方法？下面是如何解决SPAN问题的方法-将$（“#”）更改。单击（function（）到$（“#SPAN”）。单击（function（））或者我认为您也可以在复选框中只指定class而不是CssClass。将来使用FireBug之类的工具来帮助您调试并找到发生错误的那一行。@rball:谢谢您的提示-这是我在客户端voodoo中遇到的主要问题之一-我究竟如何调试它

<script type="text/javascript">
    $(document).ready(
        $("#<%= rbnDontLimit.ClientID %>").click(function() {
            $("#<%= months12.ClientID %>").removeAttr("disabled"); 
            $("#<%= months24.ClientID %>").removeAttr("disabled"); 
            $("#<%= months36.ClientID %>").removeAttr("disabled"); 
        },
        $("#<%= rbnDoLimit.ClientID %>").click(function() {
            $("#<%= months12.ClientID %>").attr('disabled','true'); 
            $("#<%= months24.ClientID %>").attr('disabled','true'); 
            $("#<%= months36.ClientID %>").attr('disabled','true'); 
        });
</script>

 $(document).ready(
    $('#rbnDontLimit').click(function() {
        $(".dcDetails :input").removeAttr('disabled');
    }),
    $("#rbnDoLimit").click(function() {
        $('.dcDetails :input').attr('disabled', 'true');
    }));

   $(document).ready(function() {
        $('#rbnDontLimit').click(function() {
            $(".dcDetails").removeAttr('disabled');
        });
        $("#rbnDoLimit").click(function() {
            $('.dcDetails').attr('disabled', true);
        });
    });