Question

使用jQuery我想能够点击一个元素，它也会检查它的相关单选按钮。我有这个工作正常，直到我们不得不将runat =“server”添加到单选按钮。

当我应用它时，它会阻止我的jQuery函数工作，我无法弄清楚如何绕过它，这是代码的简化版本：

HTML

<input type="radio" runat="server" id="sector1Radio" name="SectorGroup" title="Sector1" />

的jQuery

$('#SomethingElse').click(function() {
    $('input[title=Sector1]').attr('checked','checked');
});

我发现当它转换为.net控件而不是checked =“checked”（因为它通常是）它只是Checked，所以我改变了但是在多个浏览器中检查DOM时，没有正在检查我的单选按钮： - （

还有其他方法可以使用jQuery检查runat =“server”的单选按钮吗？

干杯！

Answer 1

我认为你的问题是输入的id不再是sector1Radio而是ctl00_sector1Radio或类似的东西。如果你的输入控件位于例如ContentPlaceHolder控件（使用母版页时）。

您可以检查生成的HTML代码（在浏览器中）以验证是否是这种情况？输入控件的id是什么？

如果是这种情况，您需要生成您的js jQuery代码

$('#SomethingElse').click(function() {
  $('input[title=Sector1]').attr('checked','checked');
});

来自codebehind的

以便SomeThingElse被控件的ClientID替换。

Answer 2

.is（'：checked'）适用于ASP.NET radiobuttons和复选框

$('#SomethingElse').click(function() {
    $('input[title=Sector1]').is(':checked');
});

Answer 3

我遇到了同样的问题。要使用jQuery UI使你的radiobuttons更好，必须写：

<div id="radio">
<input type="radio" id="radio1" runat="server" />
<label for="radio1">The label of the radio button</label>
...
</div>

<script type="text/javascript">
$('#radio').buttonset();
</script>

输入标记的id必须由标签的for属性正确引用。如果网页在母版页内，那么输入标记的id将被修改为类似ctl00_Something_radio1的内容，突然标签的属性不再引用输入标记。在ASP.NET中要小心这一点！

Answer 4

尝试使用

$('input[title=Sector1]').attr('checked',true);

和

$('input[title=Sector1]').attr('checked',false);

或者

$('#SomethingElse').click(function () {
    $('input[title=Sector1]').attr('checked',!$('input[title=Sector1]').attr('checked'));
});

Answer 5

正如其他人所建议的那样，ASP.net不会生成具有您指定的相同ID的html。

快速解决方案：

您可以继续使用id，但要求jquery检查id的结尾，例如：
。
$（ “输入[ID $ = 'sector1Radio']”）是（ “：检查”）;
或者按照Nico的建议检查标题和名称
使用不受ASP.net影响的class元素，例如

＆lt; input type =“radio”runat =“server”id =“sector1Radio”class =“sector1Radio”name =“SectorGroup”title =“Sector1”/＆gt;
。
$（ “input.sector1Radio”）是（ “：检查”）;

最好的方法是查看生成的html代码并查看id给你的内容，然后你可以使用适当的jquery选择器，因为生成的id可能有不同的扩展名取决于你是否使用母版页等。

Answer 6

如果您正在使用MasterPage或正在动态创建控件，那么很可能控件ID被重命名为#SomethingElse变为#MainContent_SomethingElse。

检查此问题的最简单方法是使用适用于Firefox或Chrome的WebDeveloper插件。转到信息 - ＆gt;显示元素信息，然后选择有问题的对象。它将为您提供ID，课程以及祖先和儿童信息。检查.NET是否正在动态更改ID。

如果是这样的话：

为防止这种情况，您可以在服务器端代码中使用以下属性创建静态ID

SomethingElse.ClientIDMode = ClientIDMode.Static;

然后你可以在jQuery中引用

$('#SomethingElse').click(function() {
            if ($('input[title=Sector1]').attr('checked')) {
             //execute event
});

Answer 7

我认为发生的事情是ASP NET Checkboxes和Radio Buttons在输入后产生“输入”和“跨度”。所以你只需要选择输入。

您可以尝试：

$('.classname input[type=checkbox]').each(function() {
        this.checked = true;
});

Answer 8

这里有两件事：找到控件并执行检查。在ASP.NET中，您的控件的实际ID和名称将最终根据它出现的runat =“server”容器进行更改，即使这些容器没有ID。

渲染的ASP.NET控件总是以与您开头时相同的名称结尾，因此标记如：

<input type="radio" runat="server" id="sector1Radio" title="Sector1" />

最终可能会被渲染为

<input type="radio" runat="server" id="ctl0$ctl0$sector1Radio" name="ctl0_ctl0_SectorGroup" title="Sector1" />

如果在JQuery中使用“包含”选择语法，即使在呈现此元素之后，也可以找到它。所以要找到这个元素，一旦渲染，你可以使用：

$("input[type='radio'][id*='$sector1Radio']")

此语法将找到任何ID为“$ sector1Radio”

的单选按钮

获得元素后，您可以使用以下代码选中或取消选中该代码，您可以从其他元素的click事件中调用该代码。

// check the radio button
$("input[type='radio'][id*='$sector1Radio']").attr('checked', true);    

// uncheck the radio button
$("input[type='radio'][id*='$sector1Radio']").attr('checked', false);

最后一件事......如果您只是想要一个文本块在按下时单击按钮（将其包装在标签中并将AssociatedControlId属性设置为单选按钮的控件名称，就像这样...

<input type="radio" runat="server" id="sector1Radio" title="Sector1" />
<asp:label runat="server" id="lblsector1Radio" associatedControlID="sector1Radio">clicking here clicks and unclicks the radio button</asp:label>

当单选按钮运行=“服务器”时，用jQuery检查单选按钮？

8 个答案: