1

我有一个每次单击单选按钮时都可以显示 div 的代码,它工作正常。问题是我希望检查所有单选按钮,然后显示 div。

这是我的 1 个单选按钮的代码

function showstuff(nxt){
   document.getElementById(nxtb).style.display="block";
}

<input id="ny" name="ny" type="radio" onClick="document.getElementById('ny').checked =
true; showstuff('nxt');" />

<div id="nxtb">Next</div>

提前致谢

4

1 回答 1

0

这是一个没有突兀的 JavaScript(即onclick属性)的解决方案:

/*
 * Convert to array so we can use `forEach()` and `every()`
 */
function toArray(any) {
    return Array.prototype.slice.call(any);
}

var observed = toArray(document.querySelectorAll('[data-observe]'));
var listened = [];
var result = document.querySelector('#result');

/*
 * Gather all elements we want to listen for change:
 * observed elements and their siblings with the same name
 */
observed.forEach(function (target) {
    var siblings = toArray(document.querySelectorAll('[name=' + target.name +']'));
    listened = listened.concat(siblings);
});

listened.forEach(function (radio) {
    radio.addEventListener('change', function () {
        var checked = observed.every(function (item) {
            return item.checked;
        });

        checked ?
            result.removeAttribute('hidden') :
            result.setAttribute('hidden', 'true');
    });
});

演示:http: //jsfiddle.net/sZHAA/1/

于 2013-10-24T14:48:00.960 回答