Javascript 选中单选按钮时显示div
这里有点挣扎。我的eventlistener只检测单选按钮的“选中”更改,而不是“未选中”更改。注意:仅限纯javascript(vanillajs),无jQuery 用一点小技巧来解释我的问题:Javascript 选中单选按钮时显示div,javascript,forms,radio-button,Javascript,Forms,Radio Button,这里有点挣扎。我的eventlistener只检测单选按钮的“选中”更改,而不是“未选中”更改。注意:仅限纯javascript(vanillajs),无jQuery 用一点小技巧来解释我的问题: 要做到这一点,最简单的方法是收听一个名为radio的所有单选按钮 (function() { "use strict"; document.querySelector("#radio1").addEventListener("change", function() { a
要做到这一点,最简单的方法是收听一个名为radio的所有单选按钮
(function() {
"use strict";
document.querySelector("#radio1").addEventListener("change", function() {
alert("checked radio 1");
});
document.querySelector("#radio2").addEventListener("change", function() {
alert("checked radio 2");
});
})();
只有在单个输入中才能显示更多属性。请注意,程序更改不会触发事件。@我只想检查第一个单选按钮是否更改。我不做任何程序更改,我只听(本机)更改事件?还是我错了?@Teemu-Aha好吧,我不知道这实际上是一个程序上的改变。现在更有意义了。我不喜欢把它包装成任何额外的元素。我将首先尝试使用一些额外的数据属性。请注意,您也可以侦听
表单
元素中的更改。尽管这需要在处理程序中进行更多的过滤,以识别您实际想要侦听的单选按钮组。
(function() {
"use strict";
var elements = document.querySelectorAll('[data-show-more]');
[].forEach.call(elements, function(element) {
element.addEventListener('change', function(e) {
e.preventDefault();
var target = document.querySelectorAll('[data-hook="' + this.getAttribute('data-target') + '"]')[0];
alert("change detected");
}, false);
});
})();
(function() {
"use strict";
document.querySelector("#radio1").addEventListener("change", function() {
alert("checked radio 1");
});
document.querySelector("#radio2").addEventListener("change", function() {
alert("checked radio 2");
});
})();