onchange不使用单选按钮

Question

我有几个单选按钮,应该调用hider(某些东西); 当他们改变时,意味着他们被检查或取消选中.这是有效的,即在检查时它们调用JS函数,但是,如果由于从该组中选择另一个单选按钮而未选中它们,则它不会再次调用js脚本.

我是否需要使用其他东西而不是onchange？

这就是目前单选按钮的样子:

<input name="ostype" type="radio" value="0" onchange="hider(solaris);">solaris
<input name="ostype" type="radio" value="1" onchange="hider(linux);">linux

我的隐藏功能目前是:

function hider(divid) {
 if ($(divid).is('.hidden')) {
  $(divid).removeClass('hidden');
 } else {
  $(divid).addClass('hidden');
 }
}

Answer 1

由于这个问题仍未得到正确回答,但在谷歌的"单选按钮更改"中对我来说排名很高,这对于任何仍在寻找的人来说都是一个合适的解决方案.

如果你正在使用jQuery,只需使用Flavius Stef所指出的jQuery的属性选择器.

OP,你的代码所做的并不完全清楚.让我们在您的代码中假设您要将"隐藏"类添加到任何活动的单选按钮.

$("your selector here").change(function() {
    $('input[name="' + this.name + '"]').removeClass("hidden");

    $(this).addClass("hidden");
});

请注意$(this)(jQuery对象)和this(DOM对象)之间的区别.基本上我是从每个同名输入中删除"隐藏"类,然后我将"隐藏"类添加到当前输入.

当然我在这里假设您没有在页面上的不同输入上使用重复的名称.另请注意,这仅适用于单选按钮,因为单选按钮"更改"事件仅在激活时触发,而不是在取消激活时触发.

在复选框和单选按钮上收听onchange

就我而言,我想在活动的单选按钮和复选框中添加一个"已检查"类.由于复选框在选中和取消选中时都会触发"onchange"事件,因此我需要一些额外的代码.

$('input[type="radio"]').change(function() {
    $('input[name="' + this.name + '"]').removeClass("checked");
    $(this).addClass("checked");
});

$('input[type="checkbox"]').change(function() {
    $(this).toggleClass("checked", ($(this).is(":checked")));
});

后一个函数使用toggleClass设置"checked"类,如果.is(":checked")是true.

或者,您可能希望将这两个函数组合成以下内容:

$('input[type="radio"], input[type="checkbox"]').change(function() {
    if(this.type == "radio")
        $('input[name="' + this.name + '"]').removeClass("checked");

    $(this).toggleClass("checked", ($(this).is(":checked")));
});

无论哪种方式,在收听onclick事件时总是要小心,因为当通过键盘导航激活输入时它不会触发.