jquery - 如何使用 jQuery 找到同一逻辑 "group"内的所有单选按钮？

Question

我正在编写一些代码来突出显示所有 <input type=radio />当其中任何一个发生更改时，位于“ radio 组”内。
在 radio “更改”事件的事件处理程序中，我使用以下代码来查找所有其他类似的 radio :

radioHandler: function (event) {
    var element = $(this);
    var name = element.attr("name");
    // Find all radios in the same group:
    element.closest("form")
        .find("input[type=radio][name='" + name + "']")
        .each(function(){
            ... etc ...
        });
},

如果 radio 确实包含在表单中，则效果非常好。
但是，如果表单外部也有 radio ，我也希望它能够工作。

例如，假设所有 radio 都使用相同的 name ，以下代表 3 个不同的单选按钮组(所有浏览器均以这种方式运行):

       o Radio A | o Radio B | o Radio C          (Group - no form)
<form> o Radio D | o Radio E | o Radio F </form>  (Group - form 1)
<form> o Radio G | o Radio H | o Radio I </form>  (Group - form 2)

如果我有一个元素，仅查找属于其“组”的 radio 的最佳方法是什么？

此外，为了奖励积分......如果该元素不是当前文档的一部分——即它包含在另一个“独立”上下文中怎么办？当前的解决方案工作正常(因为 element.closest(...) 使用元素的上下文)。

Answer 1

不要在表单上执行 .find，而是在整个文档上执行它:

$("input[type=radio][name='" + name + "']").each(function() {
    ... etc ...
});

除非我不明白这里的问题？

编辑我没有测试下面的代码，但它可能会给你如何做的想法。

radioHandler: function (event) {
    var element = $(this);
    var name = element.attr("name");
    // Find all radios in the same group:
    if (element.parents().find("form").length > 0) {
        name.closest("form").find("input[type=radio][name='" + name + "']")
        .each(function(){
            ... etc ...
        });
    } else {
        $("input[type=radio][name='" + name + "']").each(function() {
            if (!$(this).parents().find("form").length) {
                ... etc ...
            }
        }
    }
}