Javascript get value

Question

I have a foreach loop and I'm writing some href(s) with DOM:

var href = document.createElement("a"); href.setAttribute("href", uid);

Basically I have X href and I want a javascript function fired when a user click on a href.

I tried to do add a onclick event...

href.setAttribute("onclick","displayer("+uid+");");

The uid variable:

var uid = String(Nuid);

even if is a string, and I can clearly see that in Firebug is ok (console.log)

But when I click on that link Firebug says:

wall.php:1 Uncaught ReferenceError: hEIsrMeIN4M5OoLYTlGUQg9paL73 is not defined

and it points me to <!DOCTYPE HTML> which is not the error.

The Javascript function is nothing special...

function displayer(uid){ window.alert(uid); }

@Rayon: You have added the single quote outside of double quote. — Pugazh
– Pugazh, Commented Aug 26, 2016 at 11:33
you do not use setAttribute to add events. You use addEventlistener... — epascarello
– epascarello, Commented Aug 26, 2016 at 11:33
@Pugazh – epascarello is suggesting better approach... — Rayon
– Rayon, Commented Aug 26, 2016 at 11:35

David · Accepted Answer · 2016-08-26 11:34:36Z

This:

"displayer("+uid+");"

produces this:

displayer(hEIsrMeIN4M5OoLYTlGUQg9paL73);

which is invalid syntax, because that string of characters is not an identifier. Since it's a string, it needs to be enclosed in quotes. Something like this:

"displayer('"+uid+"');"

ulybu · Accepted Answer · 2016-08-26 11:39:29Z

I would prefer use addEventListenner and get the uid value from the href attribute.

function displayer(event) { var uidElem = event.target.getAttribute('href'); alert(uidElem); } var href = document.createElement("a"); href.setAttribute("href", uid); href.textContent = "Text Content" href.addEventListener('click', displayer)

Tarek Salah uddin Mahmud · Accepted Answer · 2016-08-26 11:33:18Z

1

Do this href.setAttribute("onclick","displayer('"+uid+"');");

answered Aug 26, 2016 at 11:33

Tarek Salah uddin Mahmud

9448 silver badges18 bronze badges

Comments

jamsinclair · Accepted Answer · 2016-08-26 11:37:58Z

This is because of a type error.

href.setAttribute("onclick","displayer("+uid+");");

Will result in an anchor tag like: <a href="abc123" onclick="displayer(abc123)">

The argument you've set to be prepopulated for the displayer function is not a string and at run time we would be looking for an undefined variable.

If we update this line to include the string quotes around your UID all should be well.

href.setAttribute("onclick","displayer('"+uid+"');");

This will result in: <a href="abc123" onclick="displayer('abc123')">

With a string value being passed to your onclick function.

epascarello · Accepted Answer · 2016-08-26 11:40:58Z

Use addEventListener to add events, do not set them as an attribute.

href.addEventListener("click", function() { displayer(uid); });

The reason why your code did not work is it is adding it as an attribute. When it renders it renders as

<a href="xxxxxx" onclick="displayer(hEIsrMeIN4M5OoLYTlGUQg9paL73)">...

so when you click on it, it is looking for the variable hEIsrMeIN4M5OoLYTlGUQg9paL73, not a string.

So what do you need to do? Wrap it quotes so it is a string.

href.setAttribute("onclick","displayer('"+uid+"');");

Now why is this solution bad. Well, first the proper way to add events is with addEventListener. Second if the string inside of uid has a ' or a " it will break the event handler. The string may never have those characters in it, but if they do, that is trouble.

Collectives™ on Stack Overflow

Javascript get value

5 Answers 5

Comments

1 Comment

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

1 Comment

Comments

Comments

Comments

Related