Jquery：我怎样才能重写这段代码更高效或更保守？答案

【问题标题】：Jquery: How can I rewrite this code to be more efficient or conservative?Jquery：我怎样才能重写这段代码更高效或更保守？
【发布时间】：2016-12-15 20:23:54
【问题描述】：

此代码的唯一区别是#position1,2,3。

$('#upgradeSkillsBar').one('click', '#position1', function(){
    console.log(object);
    removeSkillButton(object);
    addSkillButton(skillList[0]);
    removeRadialSubMenu(); 
});

$('#upgradeSkillsBar').one('click', '#position2', function(){
    console.log(object);
    removeSkillButton(object);
    addSkillButton(skillList[1]);
    removeRadialSubMenu(); 
});

$('#upgradeSkillsBar').one('click', '#position3', function(){
    removeSkillButton(object);
    addSkillButton(skillList[2]);
    removeRadialSubMenu(); 
});

我想把它写在函数看起来像这样的地方。

$('#upgradeSkillsBar').one('click', '#position1', '#position2', '#position3' function(){
    console.log(object);
    removeSkillButton(object);
    addSkillButton(skillList[0]);
    removeRadialSubMenu(); 
});

有没有办法做到这一点？因为目前我尝试它时它不起作用。我对 jquery 不是很好。让这段代码更高效的最佳方法是什么？

【问题讨论】：

不，我必须使用 .one，因为我要更新 DOM 中的多个元素。按下后我必须立即删除监听器。
组合选择器的方法是在单个选择器字符串中使用逗号：'#position1, #position2, #position3'
我真的不喜欢看到不必要的代码重复。有没有办法让你修改 HTML？

标签： jquery dry

【解决方案1】：

假设所有positionN 元素都是兄弟元素，您可以使用.index() 获取它们的位置，然后将其用作数组索引。

不要使用 ID，而是给它们全部class="position"。然后做：

$('#upgradeSkillsBar').one('click', '.position', function(){
    removeSkillButton(object);
    addSkillButton(skillList[$(this).index()]);
    removeRadialSubMenu(); 
});

【讨论】：

@uom-pgregorio 你为什么这么认为？您是否阅读了他上面关于他为什么使用.one() 而不是.on() 的第一条评论？
对不起，我没有 - 我目前正忙着写自己的答案。哈哈。那没关系。