通过单选按钮循环事件监听器。可能吗?

时间:2018-03-05 08:13:34

标签: javascript loops slider addeventlistener

昨天我试图使用JavaScript在单选按钮上创建一个滑块,几个小时后完成下面引用的代码。我对JavaScript很陌生,但知道重复操作应放在循环中。那么有机会这样做吗?

var slide = document.getElementsByClassName('slide');

var radio = document.querySelectorAll('.slider-form [type="radio"]');


var x = function () {
    for( var i = 0; i < slide.length; i += 1) {
        if(radio[i].checked === true) {
            slide[i].style.display = "flex";
        } 
    }
}

x();

radio[0].addEventListener('change', function () {
    slide[0].style.display = "flex";
    slide[1].style.display = "none";
    slide[2].style.display = "none";
});

radio[1].addEventListener('change', function () {
    slide[0].style.display = "none";
    slide[1].style.display = "flex";
    slide[2].style.display = "none";
});

radio[2].addEventListener('change', function () {
    slide[0].style.display = "none";
    slide[1].style.display = "none";
    slide[2].style.display = "flex";
});

第二个问题是,我可以用幻灯片[相同的数字]以某种方式绑定我的收音机[数字],所以我可以像这个例子中那样改变类:

$("input[type=radio]:not(:checked)").addClass("hiddenRadio");

同样,我对最小化代码感兴趣(因为可能有十个或更多按钮),所以有没有办法在1-2行代码或循环中应用更改类。< / p>

1 个答案:

答案 0 :(得分:0)

尝试以下解决方案。我认为这将解决您的问题。

clc;
clear all;
close all;

rgb = imread('test.jpg'); 
figure;
imshow(rgb);
binaryImage=im2bw(rgb);
bw = im2bw(rgb, graythresh(rgb));
imshow(bw)
L = bwlabel(bw);
imshow(rgb) hold on

[centers, radii, metric] = imfindcircles(rgb,[9 24],'ObjectPolarity','dark','Sensitivity',0.86,'Method','twostage');

m = viscircles(centers,radii);
[a,b]=size(centers);
disp(a); 
disp(b);
s = regionprops(L, 'Centroid');
for k = 1:numel(s)
  c = s(k).Centroid;
  text(c(1), c(2), sprintf('%d', k), ...
     'Color', 'w', ...
     'HorizontalAlignment', 'center', ...
     'VerticalAlignment', 'middle');
 end
hold off