Javascript 简化jQuery选择器高亮显示
我有100多个视频,我使用一个功能来突出显示点击的链接。代码思想很长,我觉得必须有一种方法将其简化为for循环之类的东西。有什么想法吗Javascript 简化jQuery选择器高亮显示,javascript,jquery,Javascript,Jquery,我有100多个视频,我使用一个功能来突出显示点击的链接。代码思想很长,我觉得必须有一种方法将其简化为for循环之类的东西。有什么想法吗 var vid_all0 = $('#vid_link0, #vidtop_link0, .vidtop_link0, #vidmob_link0, #link0'); //cache selector vid_all0.click(function () { $('[id^=vid_link],[id^=vidtop_link
var vid_all0 = $('#vid_link0, #vidtop_link0, .vidtop_link0, #vidmob_link0, #link0'); //cache selector
vid_all0.click(function () {
$('[id^=vid_link],[id^=vidtop_link],[id^=vidmob_link], .vidtop_link0').css('background-color', 'inherit');
vid_all0.css('background-color', '#A9CDEB'); //change color of all elements
$('.vidtop_link0').css('background-color', 'inherit');
});
var vid_all1 = $('#vid_link1, #vidtop_link1, #vidmob_link1,#link10'); //cache selector
vid_all1.click(function () {
$('[id^=vid_link],[id^=vidtop_link],[id^=vidmob_link]').css('background-color', 'inherit');
vid_all1.css('background-color', '#A9CDEB'); //change color of all elements
});
var vid_all2 = $('#vid_link2, #vidtop_link2, #vidmob_link2,#link19'); //cache selector
vid_all2.click(function () {
$('[id^=vid_link],[id^=vidtop_link],[id^=vidmob_link]').css('background-color', 'inherit');
vid_all2.css('background-color', '#A9CDEB'); //change color of all elements
});
。。。
将所有这些元素赋予相同的类,然后将所有元素与该类一起使用,如下所示
$(".vidtop").on("click", function()
{
// Do something with their CSS
});
如果您无法使用类修改HTML,那么类似这样的操作应该可以:
for (var i=1; i=99; i==;) {
$(vid_all + i).click(function () {
$(this).find('[id^=vid_link],[id^=vidtop_link],[id^=vidmob_link]').css('background-color', 'inherit');
});
}
我不确定我是否正确理解了您的代码,但这似乎是一个更简单的版本:
function doStuff(links, additional) {
links.click(function() {
$('[id^=vid_link],[id^=vidtop_link],[id^=vidmob_link]' + (additional ? "," + additional : "")).css('background-color', 'inherit');
links.css('background-color', '#A9CDEB');
if (additional) {
additional.css('background-color', 'inherit');
}
});
}
// vid_all0
doStuff($('#vid_link0, #vidtop_link0, .vidtop_link0, #vidmob_link0, #link0'), $('.vidtop_link0'));
// vid_all1
doStuff($('#vid_link1, #vidtop_link1, #vidmob_link1,#link10'));
// vid_all2
doStuff($('#vid_link2, #vidtop_link2, #vidmob_link2,#link19'));
// etc.
你能发布一些html吗?为什么要使用for循环?只要通过检测元素单击时的id来突出显示单击的内容即可。jquery选择器适用于循环:例如,为什么有
,.vidtop\u link0
在vid\u all0中。单击
-第一行(下一步单击事件没有)?用#link0、#link10、#link19
序列会怎么样?