Pass the value attribute data from HTML side to JavaScript function via onclick event

Question

Is there a way to pass the value attribute from HTML side to JavaScript function via onclick event?

html/php

echo '<a href="#" class="ListOfStuff" value="' . $varVal . '" onclick="doFunction(this.value)"></a>';

javascript

<script>
    doFunction(value){
         alert(value);
    }
</script

this.value is undefined. This.id is the way I've handled it in the past, but now that i am dynamically writing a list with classnames, I don't quite understand how to pass the value from the HTML. This = [object OBJECT] and this.value is undefined. I can get the value if i use ID but not class. what am i doing wrong?

Have you tried writing onClick=doFunction(event) and then writing alert(event.target.value); in your Javascript? — jangxx
– jangxx, Commented Sep 8, 2014 at 1:07
Just tried it. event.target = javascript:void(0); and event.target.value = undefined — user3753569
– user3753569, Commented Sep 8, 2014 at 1:16
Okay then just write onclick=doFunction and function doFunction(event) {alert(event.target.value);} — jangxx
– jangxx, Commented Sep 8, 2014 at 1:18

Kevin · Accepted Answer · 2014-09-08 01:14:44Z

1

Alternatively, you could use the getAttribute method to get the value. Example:

<?php

$varVal = 100;
echo '<a href="#" class="ListOfStuff" value="' . $varVal . '" onclick="doFunction(this.getAttribute(\'value\'))">test</a>';

?>

<script type="text/javascript">
function doFunction(value) {
    alert(value);
}
</script>

answered Sep 8, 2014 at 1:14

Kevin

41.9k12 gold badges57 silver badges72 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Kmelkon · Accepted Answer · 2014-09-08 01:30:32Z

0

JSBin

Would something like this work for you? (using getAttribute)

HTML

<a href="#" value="myName" id="anchor" >LINK</a>

JS

  var a = document.getElementById("anchor");
a.addEventListener("click", function(event){
  event.preventDefault();
  alert(this.getAttribute("value"));
}, false);

answered Sep 8, 2014 at 1:30

Kmelkon

1159 bronze badges

Collectives™ on Stack Overflow

Pass the value attribute data from HTML side to JavaScript function via onclick event

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related