Create Dynamic Function Name for Event Listeners in JavaScript -


i have code math game. have function button defines location , draws button specified in callback.

the problem can create 1 of these, since event listeners are, baffling reason, referred function execute, rather other string name.

unfortunately means writing lot of repetitive code instead. each function called eventlistener differ name of function particular button. how people work around problem? there no way name function (see: functanim & functclick) using string?

function factsbutton(x, y, dofunction, contentcallback) {     var getid = document.getelementbyid("canvas_1");      if (getid.getcontext)     {         var ctx = getid.getcontext("2d");          var btnw = 100;         var btnh = 100;         var cx = x - btnw/2;         var cy = y - btnh/2;         var left = cx;         var right = cx + btnw;         var top = cy;         var bottom = cy + btnh;          function functanim(event)         {                var mousepos = getmousepos(getid, event);             var rect = getid.getboundingclientrect();             var mousex = mousepos.x;             var mousey = mousepos.y;             if (mousex >= left                 && mousex <= right                 && mousey >= top                 && mousey <= bottom)             {                 contentcallback(cx, cy, btnw, btnh, true);              }             else             {                 contentcallback(cx, cy, btnw, btnh, false);             }          }          function functclick(event)         {             var mousepos = getmousepos(getid, event);             var rect = getid.getboundingclientrect();             var clickx = mousepos.x;             var clicky = mousepos.y;             if (clickx >= left                 && clickx <= right                 && clicky >= top                 && clicky <= bottom)             {                 dofunction();                 getid.removeeventlistener("mousemove", functanim, false);                 getid.removeeventlistener("click", functclick, false);             }          }          contentcallback(cx, cy, btnw, btnh, false);         getid.addeventlistener("click", functclick, false);         getid.addeventlistener("mousemove", functanim, false);     } } 

edit:

for reason wasn't clear wanted. i'm not wanting call functions string, rather create them dynamic names. instance, since need 4 buttons created, call function this: factsbutton(50, 50, addclicked, "add"); "add", instead of "functclick" called "addclick" , "addanim" or "sub" instead of "add", create events , functions "subanim" , "subclick". way 8 separate event listeners each different "names". otherwise end 2 despite having 4 buttons.

the wording of question confuses me reason :-\

anyway,

if want call function string instead of function pointer, add functions elements in javascript object.

// javascript object containing function definitions  var myfunctions={      functanim: function(event)         {                var mousepos = getmousepos(getid, event);             var rect = getid.getboundingclientrect();             var mousex = mousepos.x;             var mousey = mousepos.y;             if (mousex >= left                 && mousex <= right                 && mousey >= top                 && mousey <= bottom)             {                 contentcallback(cx, cy, btnw, btnh, true);             }             else             {                 contentcallback(cx, cy, btnw, btnh, false);             }         },       functclick: function(event)     {         var mousepos = getmousepos(getid, event);         var rect = getid.getboundingclientrect();         var clickx = mousepos.x;         var clicky = mousepos.y;         if (clickx >= left             && clickx <= right             && clicky >= top             && clicky <= bottom)         {             dofunction();             getid.removeeventlistener("mousemove", functanim, false);             getid.removeeventlistener("click", functclick, false);         }     }  } 

then can call functions string.

// useage myfunctions["functanim"](eventobject);   // calls functanim myfunctions["functclick"](eventobject);  // calls functclick 

Comments

Popular posts from this blog

PHPMotion implementation - URL based videos (Hosted on separate location) -

javascript - Using Windows Media Player as video fallback for video tag -

c# - Unity IoC Lifetime per HttpRequest for UserStore -