对同一功能使用不同的对象属性

在我正在工作的化身生成器中，我有几个按钮事件可以做同样的事情，但使用不同的身体部位。我不希望有不同的功能做同样的事情，所以我想对所有身体部位使用一个功能。对同一功能使用不同的对象属性

下面的第14行使用对象propery'AvGen.eyes.currEyesNr'，但是我想用一个点击按钮。我可以将什么作为参数放入，以及如何使用函数中的参数来使用正确的对象参数？从currBodyNr属性指示当前索引值的

1. prevBodyBtn.on('click', function(){ 
    2.  if (AvGen.theBody.currBodyNr > 0) { 
    3.   changePart(-1); 
    4.  } 
    5. }); 
    6. 
    7. prevEyesBtn.on('click', function(){ 
    8.  if (AvGen.eyes.currEyesNr > 0) { 
    9.   changePart(-1); 
    10.  } 
    11. }); 
    12. 
    13. function changePart(direction) { 
    14.  AvGen.eyes.currEyesNr += direction; // <-- this is now always 'AvGen.eyes.currEyesNr' but should be dynamic 
    15. 
    16.  var body = AvGen.theBody.bodies[AvGen.theBody.currBodyNr], 
    17.   eyes = AvGen.eyes.eyes[AvGen.eyes.currEyesNr], 
    18.   nose = AvGen.nose.noses[AvGen.nose.currNoseNr]; 
    19.   mouth = AvGen.mouth.mouths[AvGen.mouth.currMouthNr]; 
    20. 
    21.  AvGen.addSVG(body, eyes, nose, mouth); 
    22. }

来源

2013-06-19 holyredbeard

更改名字，currEyesNr等，以currNr。

然后你可以直呼其名的AvGen所需的属性：

function changePart(direction, bodyPartName) { 

var part = AvGen[bodyPartName]; 
part.currNr += direction; 

...

，并称之为：

changePart(-1, "eyes");

或

changePart(-1, "theBody");

另一种方式来做到这一点是简单地传递需要改变的身体部分作为第二个参数：

function changePart(direction, bodyPart) { 
    bodyPart.currNr += direction;

，并称之为：

changePart(-1, AvGen.eyes);

来源

2013-06-19 21:54:07 Igor

很好的答案，谢谢！ – holyredbeard

你可以传递参数给“click”事件的回调，并检查单击了哪个项目。比使用它来传递你想要的'changePart'函数。（你可以读取你点击元素中的一些数据，例如将它们传递给你的函数）

prevEyesBtn.on('click', function(e){ 

    e.currentTarget; // this is the element that was clicked for example 
    if (AvGen.eyes.currEyesNr > 0) { 
     changePart(-1); 
    } 
});

来源

2013-06-19 21:57:57 AntouanK

对同一功能使用不同的对象属性

回答

相关问题