如何检测此单选按钮是否已选中

How to detect if this radiobutton is checked?

本文关键字：是否 单选按钮 何检测 检测      更新时间：2023-09-26

我在stackoverflow上读了很多东西，但没有什么帮助：（

我有这个HTML表，由ajax请求加载：

<table class="table table-striped table-hover choix_annonce_table">
    <thead>
        <tr>
            <th>Sélection</th>
            <th>Visuel</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><input type="radio" value="45" name="idAnnonce"></td>
            <td><img alt="Annonce 1" src=""></td>
        </tr>
        <tr>
            <td><input type="radio" value="46" name="idAnnonce"></td>
            <td><img alt="Annonce 2" src=""></td>
        </tr>        
    </tbody>
</table>

我试图检测单选按钮何时被选中，但以下问题都不起作用（在我的"主页"上包含的js文件中）：

$(document).ready(function() {
    $("input[name=idAnnonce]").click(function(){
        alert("xx");
    });
});

或

$(document).ready(function() {
    $("input[name=idAnnonce]:radio").change(function () {
        alert("xx");
    });
});

你有主意吗？

EDIT：当我使用ajax将JS直接加载到加载的表中时，它就可以工作了。为什么？

之所以会发生这种情况，是因为.click()和.change()方法以及所有其他事件处理程序只监视附加事件时存在的元素上的这些事件。

为了解决这个问题，而不是使用这个：

$('input[name=idAnnonce]').change(function() {
    // ...
});

用这样的东西代替：

/* Use 'body' or any element that will contain the form */
$('body').on('change', 'input[name=idAnnonce]', function() {
    // ...
});

这将监视传递到主体的点击事件，并且只为那些匹配选择器的事件调用函数。

如果您的javascript直接加载到html文件中，那么它将在加载和解析html文件时执行。当javascript在一个单独的文件中时，需要调用它。您可以通过执行一个"onload"函数作为body标记语句的一部分来实现这一点。html的这一部分丢失了，所以在加载表时，不清楚您是否真的在加载任何内容
您还可以通过ajax加载结束时的回调来执行这些事件监视器。

通过ajax加载表时，需要通过ajax调用引入javascript。这意味着传入的表还应该包含引用该表的javascript。父页面上的DOM不知道该表，因此父页面中的javascript不会对新内容起作用。

$(document).ready(function() {
  $('input[type=radio][name=idAnnounce]').change(function(evt) {
  console.log(evt.target.value)
  });
});

您使用的选择器错误。

上面的代码应该有助于

欢呼

相关文章：