Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    Rok
    Rok is offline
    New Coder
    Join Date
    Sep 2002
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to pass arguments independently or using addEventListener

    Well, I use addEventListener and I cannot (or at least don't know how) pass arguments to the function.

    Let's say we have a function:
    function warning(arg1, arg2) {alert('Argument 1: ' + arg1 + ', Argument2: ' + arg2 + '.');}

    It's possible to have:
    onclick="warning('my argument 1', 'my argument 1');" as an html attribut.

    But I think it's not posible to do it like this (still the same function):
    el.addEventListener("click", warning('my argument 1', 'my argument 1'), false);

    So how can I pass arguments to the function?

  • #2
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    addEventListener requires a reference to a function. By passing arguments, you are inserting the return value of the function. An equivalent of what you want:

    document.addEventListener('eventname', function(event) { doSomething('arg1', 'arg2') }, false);

  • #3
    Rok
    Rok is offline
    New Coder
    Join Date
    Sep 2002
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Cool, just what I need.
    Thanx!

  • #4
    Rok
    Rok is offline
    New Coder
    Join Date
    Sep 2002
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Now I cannot removeEventListener

    Now that I've used
    document.addEventListener("mousemove", function(event) {move (objectID)}, false);

    now I cannot removeEventListener . I've tried many things:

    ------------------------------------------------------------------------------------
    document.removeEventListener("mousemove", function(event) {move (objectID)}, false);

    document.removeEventListener("mousemove", move, false);

    ...
    ------------------------------------------------------------------------------------

    But none of them worked. How can I fix this?

  • #5
    Rok
    Rok is offline
    New Coder
    Join Date
    Sep 2002
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts

    here's the example

    I've written a short page just for this example. Please check it out.

    page

  • #6
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    removeEventListener requires the identical arguments passed to addEvent Listener.

    You are using an anonymous function as the second argument, which is forever lost once used:

    function(){doSomething()} == function(){doSomething()}
    // false

    Which means you'll have to declare your wrapper function separate:

    function eventWrapper(event) {
    move(objectID);
    }

    And pass eventWrapper into addEventListener as opposed to function(event) {move (objectID)}

  • #7
    Rok
    Rok is offline
    New Coder
    Join Date
    Sep 2002
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well, I still have to pass an argument to a function using addEventListener.
    But I've solved my problem using one simple ****** variable .
    But thnx anyway!

  • #8
    New Coder
    Join Date
    Jul 2005
    Location
    Switzerland
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Solution?

    Hi Rok

    Can you post your solution ? I have the same problem.
    Thanx

  • #9
    New to the CF scene
    Join Date
    Aug 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm having the same issue....
    does someone have a solution because
    I need removeEventListener to work as well as passing variables

    (sorry to bring up such an old topic)

  • #10
    Senior Coder
    Join Date
    Sep 2005
    Posts
    1,791
    Thanks
    5
    Thanked 36 Times in 35 Posts
    jkd's post explained it pretty well. If you have something that looks like:
    Code:
    element.addEventListener('click',function() { foo(id);},false);
    then you need to use:
    Code:
    element.addEventList('click',bar=function() { foo(id);},false);
    //and then
    element.removeEventListener('click',bar,false);
    [/code]
    My thoughts on some things: http://codemeetsmusic.com
    And my scrapbook of cool things: http://gjones.tumblr.com


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •