Question

当我选择单选按钮时，我正在尝试编写一些jquery来捕获事件。当我检查页面时，源代码如下：

<input id="ProgTrain_6__5" type="radio" name="ctl00$ContentPlaceHolder1$ctl02$MyResponse$ProgTrain_6" value="ProgTrain_6__5" checked="checked" onclick="clientScriptProgTrain_6_specifyToggleState();" validate="">

我做了几次这样的尝试：

$('input[type=radio][name="ProgTrain_row6"]').change(function () {
        alert('hi');
    });

$('input[type=radio][name*=ProgTrain_row6]').click(function ()
$('#ProgTrain_row6').click(function ()

{
    alert('radio button selected');
    if ($(this).attr("checked") == "checked") {
        alert("checked");
    }
});


$('#ProgTrain_6__5').click(function ()
$('input[type=radio][name*=ProgTrain_6__5]').click(function ()
{
    alert('radio button selected');
    if ($(this).attr("checked") == "checked") {
        alert("checked");
    }
});


if ($('input[@name=ProgTrain_row6]:radio:checked').length > 0) {
    alert('radio button clicked')
};

请告知。

Answer 1

您可以利用jQuery的ends-with selector $=，它允许您根据特定属性的值来定位元素。

在您的情况下，您可以使用以＆＃34; Prog_Train6＆＃34;结束的名称属性来定位任何元素。：

$('[name=$"ProgTrain_6"]').change(function () {
    alert($(this).is(':checked')? 'Checked!' : 'Unchecked!');
});

如果您想要实际定位点击的任何单选按钮，您也可以使用:radio选择器处理此问题：

$(':radio').change(function(){
    // Some radio button was changed, refer to it using $(this) here...
});

Answer 2

您可以使用更改事件而不是单击事件。这将允许由键盘或其他方式驱动的事件。您还可以为checked属性优化条件。

$('#ProgTrain_6__5').on('change', function() {
  alert('radio button selected');
  if (this.checked) {
    alert("checked");
  }
});

另一种方法是，将输入包装在另一个元素中，然后使用包装器和输入类型进行选择：

<div class="mywrapper">
  <input id="ProgTrain_6__5" type="radio" name="ctl00$ContentPlaceHolder1$ctl02$MyResponse$ProgTrain_6" value="ProgTrain_6__5" validate="" />
  <input id="ProgTrain_6__6" type="radio" name="ctl00$ContentPlaceHolder1$ctl02$MyResponse$ProgTrain_6" value="ProgTrain_6__6" validate="" />
</div>

代码：

$('.mywrapper').on('change', 'input[type="radio"]', function() {
  alert(this.value + ":" + this.id);
});

Jquery甚至需要捕获单选按钮

2 个答案: