Question

In the function below I’m trying to create a dynamic element (textArea). I’m trying to bind a function (resize) to the text area using textArea.onclick = resize; which works fine.

What I’d like to do is pass a parameter to the resize function (either the generated id or, if possible, the textArea itself)

    function addElement(elm, event) {
        var textArea = document.createElement('textarea');
        var id = Math.random();
        textArea.setAttribute('id', id)
        textArea.setAttribute('cols', 1);
        textArea.setAttribute('rows', 3);
        textArea.onclick = resize;
        elm.appendChild(textArea);
    }

if I say textArea.onclick = resize(id); then that just calls the function.

How can i bind the function, and pass a parameter to it?

Answer 1

Use a closure:

textArea.onclick = function() { resize(id); };

Or use the elements id attribute:

textArea.onclick = function() { resize(this.id); };