我可以确定使用JavaScript单击的内容吗？

Question

Once again I've inherited someone else's system which is a bit of a mess. I'm currently working with an old ASP.NET (VB) webforms app that spits JavaScript onto the client via the server - not nice! I'm also limited on what I can edit in regards to the application.

I have a scenario where I have a function that does a simple exercise but would also need to know what item was clicked to executed the function, as the function can be executed from a number of places within the system...

Say I had a function like so...

 function updateMyDiv() {
    $('#div1').hide();
    $('#div2').hide();
    $('#div13').show();
 }

how could I get the ID (for example) of the HTML element that was clicked to execute this?

Something like:

function updateMyDiv() {

    alert(htmlelement.id) // need to raise the ID of what was clicked, 

    $('#div1').hide();
    $('#div2').hide();
    $('#div13').show();
}

I can expand on this if neccessary, do I need to pass this as an arguement?

Answer 1

The this keyword references the element that fired the event. Either:

<element onClick="doSomething(this);">

or

element.onclick = function() {
    alert(this.id);
}

Answer 2

Bind your click events with jQuery and then reference $(this)

$('.myDivClass').live('click', function () {
    updateMyDiv(this);
});

var updateMyDiv = function (that) {
   alert(that.id);

   // save the world
};

Answer 3

You don't need to pass " this ", it is assigned automatically. You can do something like this:

$('div').click(function(){
  alert($(this).attr('id'));
})

Answer 4

Attach the function as the elements event handler is one way,

$(htmlelement).click(updateMyDiv);

If you are working with an already generated event, you can call getElementByPoint and pass in the events x,y coords to get the element the mouse was hovering over.

Answer 5

$('.something').click(function(){
    alert($(this).attr('id'));
});

Answer 6

You would need to pass it the event.target variable.

$("element").click(function(event) {
    updateMyDiv($(event.target));
});

function updateMyDiv(target) {
    alert(target.prop("id"));
}

Answer 7

Where is your .click event handler? Wherever it is, the variable this inside of it will be the element clicked upon.

If you have an onclick attribute firing your function, change it to

<tag attribute="value" onclick="updateMyDiv(this)">

and change the JavaScript to

function updateMyDiv(obj) {
    alert(obj.getAttribute('id')) // need to raise the ID of what was clicked, 

    $('#div1').hide();
    $('#div2').hide();
    $('#div13').show();
}

Answer 8

使用.attr('id')方法并指定将返回所需内容的ID。