5

使用 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" 的单选按钮吗？

干杯!

4

8 回答 8

2

我认为您的问题是输入的 id 不再是ector1Radio，而是 ctl00_sector1Radio 或类似的东西。如果您的输入控件位于例如 ContentPlaceHolder 控件中（使用母版页时），则会发生这种情况。

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

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

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

来自代码隐藏，以便将 SomeThingElse 替换为控件的 ClientID。

于 2010-08-31T06:59:51.273 回答
1

.is(':checked') 适用于 ASP.NET 单选按钮和复选框

$('#SomethingElse').click(function() {
    $('input[title=Sector1]').is(':checked');
});
于 2010-08-30T14:38:37.860 回答
0

我有同样的问题。要使用 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，并且突然标签的 for 属性不再引用输入标签。在 ASP.NET 中注意这一点！

于 2010-08-30T13:44:24.147 回答
0

As suggested by others, ASP.net will not generate the html with the same ID you specified.

Quick solutions:

  • You can keep using the id but asks jquery to check the end of the id instead, example:

    $("input[id$='sector1Radio']").is(":checked");

  • Or check against the title and name as Nico suggested

  • Use the class element which is not effected by ASP.net, example

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

    $("input.sector1Radio").is(":checked");

Best thing is to view the generated html code and see what id is giving you, then you can use the appropriate jquery selector, because the generated id could have different extensions depends whether you use master pages, etc.

于 2010-08-31T13:55:51.923 回答
0

这里有两件事：找到控件并执行检查。在 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>
于 2010-10-07T14:10:41.370 回答
0

尝试使用

$('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'));
});
于 2010-08-31T13:14:09.817 回答
0

我认为在 ASP NET Checkboxes and Radio Buttons 中会发生什么在输入之后生成一个“输入”和一个“跨度”。所以你只需要选择输入。

你可以试试：

$('.classname input[type=checkbox]').each(function() {
        this.checked = true;
});
于 2010-09-03T11:40:00.120 回答
0

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

最简单的检查方法是使用 Firefox 或 Chrome 的 WebDeveloper 插件。转到信息 -> 显示元素信息，然后选择有问题的对象。它将为您提供它的 ID、类以及祖先和子代信息。检查 .NET 是否正在动态更改 ID。

如果是这样的话：

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

SomethingElse.ClientIDMode = ClientIDMode.Static;

然后你可以在你的jQuery中引用

$('#SomethingElse').click(function() {
            if ($('input[title=Sector1]').attr('checked')) {
             //execute event
});
于 2010-09-02T23:47:02.750 回答