In function clickCircle, i want to use the li which is being clicked. So i want to receive it as a parameter.
<li class="circle" onClick='clickCircle(this)'></li>
But what should i send as an actual paramenter? ie in place of 'this'.
4 Answers
You can use this:
function clickCircle(obj) // the li element clicked in the current scope
{
var element = obj; // This is the DOM object being clicked
var $this = $(obj); // This is the jQuery object being clicked
// Use DOM object like
element.style.color="#ff0000";
// Use jQuery object like
$this.css('color', 'red');
}
2 Comments
Nelson
I had to Google this because I made the mistake of using "this" in the function declaration, so that errored out but that was just a brain fart for me...
Bassem Shahin
You are awesome :)
Try this instead
<li class="circle"></li>
$('.circle').on('click', function(event) {
event.target // your element
});
12 Comments
edi9999
The question isn't about jQuery
Fabrício Matté
You could've submitted another answer to don't carry over the downvotes.. And as you edited it while it was deleted, I'm not able to remove my downvote as it counts as not edited (seems like a bug). Or maybe it was because you edited it inside the 5 mins grace period.
intuitivepixel
@edi9999 it's labeled jQuery, so one can assume the author uses jQuery
|
You should just use the first parameter as the element.
HTML
<li class="circle" onClick='clickCircle(this)'></li>
JS
clickCircle=function(element)
{
console.log(element)
console.log(element.tagName) // This will show LI
}
JSFiddle: http://jsfiddle.net/edi9999/WhVLm/
1 Comment
DevlshOne
Probably even? No. (this) refers to the element as an object, (event) refers to the event itself.
this.value or this.indexOf() would have worked.you can do it with jquery like this:
$(function () {
$('li.circle').on('click', function () {
clickCircle($(this));
});
});
var clickCircle = function (param) {
// your code here
// param.css('color', 'red').html();
};
or with raw javascript:
HTML
<li id="circle" class="circle"></li>
JAVASCRIPT
var circle = document.getElementById('circle');
circle.addEventListener('click', function (e) {
clickCircle(e.target);
});
var clickCircle = function (param) {
// your code here
// alert(param.nodeName.toLowerCase());
}
function clickCircle(chooseSomeNameThatMakesYouHappy) {...}thisis what you want to send.