How to get the clicked link's href with jquery?
JqueryJquery Problem Overview
Does anyone know how can I get the clicked link's href with jquery? I have the link as following:
<a href="ID=1" class="testClick">Test1.</a>
<br />
<a href="ID=2" class="testClick">Test2.</a>
<br />
<a href="ID=3" class="testClick">Test3.</a>
I wrote a code as following to get the href value from the link I clicked on. But somehow this is always return me the 1st link's href (ID=1) even though I clicked on Test2 or Test3. Does anyone know what is it going on here? and how can I solve this issue?
$(".testClick").click(function () {
var value = $(".testClick").attr("href");
alert(value );
});
Jquery Solutions
Solution 1 - Jquery
this in your callback function refers to the clicked element.
$(".addressClick").click(function () {
var addressValue = $(this).attr("href");
alert(addressValue );
});
Solution 2 - Jquery
You're looking for $(this).attr("href");
Solution 3 - Jquery
$(".testClick").click(function () {
var value = $(this).attr("href");
alert(value );
});
When you use $(".className") you are getting the set of all elements that have that class. Then when you call attr it simply returns the value of the first item in the collection.
Solution 4 - Jquery
Suppose we have three anchor tags like ,
<a href="ID=1" class="testClick">Test1.</a>
<br />
<a href="ID=2" class="testClick">Test2.</a>
<br />
<a href="ID=3" class="testClick">Test3.</a>
now in script
$(".testClick").click(function () {
var anchorValue= $(this).attr("href");
alert(anchorValue);
});
use this keyword instead of className (testClick)