1

When a selector is assigned to a variable, I need to get that variable name on onclick I have created a Fiddle as an example

 var $main_img1 = $("<div/>").addClass('add1').appendTo($('#main_container'));
 var $main_img2 = $("<div/>").addClass('add2').appendTo($('#main_container'));

 $main_img1.click(function()
 {
     get_id()
 });

 $main_img2.click(function()
 {
      get_id()
 });
 function get_id(event)
 {
      console.log($(this))
      alert('i need to get selector variable on click')
 }

Output should be $main_img1 and $main_img2 when I click on the corresponding div

PaulG
  • 13,871
  • 9
  • 56
  • 78
PraJen
  • 606
  • 3
  • 11
  • add the variable name as an attribute or id to the corresponding div and then u can get it by selecting the div attr – iJade Aug 13 '14 at 10:05
  • 1
    Any specific reason why do you want the variable name?? – karan3112 Aug 13 '14 at 10:05
  • related: [Variable name as a string in Javascript](http://stackoverflow.com/questions/4602141/variable-name-as-a-string-in-javascript) – Sascha Wolf Aug 13 '14 at 10:07
  • My requirement is to get only to the variable name when assigned to any selector... Thats y i'm hanging – PraJen Aug 13 '14 at 10:09
  • @PraJen any thoughts on my comment ?? – iJade Aug 13 '14 at 10:11
  • I agree with iJay's approach, add it to an attribute on the new element somewhere. Important to note, though, id's must start with a letter, you can't assign the variable names in their entirety if they start with a $ character. –  Aug 13 '14 at 10:12
  • @ijay i should not use any custom attribute too.. – PraJen Aug 13 '14 at 10:13
  • There can be a thousand variables referring the same element, when an even occurs, You want to detect which *reference* was used to bind the handler..? I strongly believe this is an [xy problem](http://meta.stackexchange.com/questions/66377/what-is-the-xy-problem) which can be solved in a different manner. – T J Aug 13 '14 at 10:15
  • http://jsfiddle.net/arunpjohny/vmqqbrxb/6/ – Arun P Johny Aug 13 '14 at 10:15
  • or http://jsfiddle.net/arunpjohny/vmqqbrxb/7/ – Arun P Johny Aug 13 '14 at 10:16
  • @Arun i satisfied with ur answer.. But it is like reassigning once again and getting the value in static manner.. can u help more simple like event.target.id alike.. so that i can get the value and split it – PraJen Aug 13 '14 at 10:55
  • can anyone help pls.. – PraJen Aug 13 '14 at 11:00

3 Answers3

2

Here is a solution, but not sure how you are going to use it

Used Array to get the variable name.

JS

    var arr = new Array();
    arr[0] = '$main_img1';
    arr[1] = '$main_img2';

    var $main_img1 = $("<div/>").addClass('add1 add').appendTo($('#main_container'));
    var $main_img2 = $("<div/>").addClass('add2 add').appendTo($('#main_container'));

      $main_img1.click(function()
                 {
                    get_id($(this))
                 });

       $main_img2.click(function()
                 {
                    get_id($(this))
                 });
    function get_id(event)
    {
        alert(arr[$('.add').index(event)]);
    }

Update : No array needed.

    function get_id(event)
    {
        ///var temp = '$main_img' + (parseInt($('.add').index(event)) + 1);
        var temp = '$main_img' + (parseInt($('#main_container > div').index(event)) + 1);
        alert(temp);
        console.log(eval(temp));
    }

Updated DEMO

karan3112
  • 1,867
  • 14
  • 20
  • I too know to acheive it many different way @karan.. but i want my question related answer... without using any additional array or etc.. – PraJen Aug 13 '14 at 10:45
  • Can u make as simple as event.target.id alike something.. beacuse i need to use this function for many variable.. and need to split the value from it too.. – PraJen Aug 13 '14 at 11:23
  • .addClass('add1 add') if u add another class my style wont be updated.. i'll be adding another class in dynamic.. – PraJen Aug 13 '14 at 11:40
  • Basically you will just need a relation in all `divs`. Instead of the `.add` you can add a class to their parent div. And use the parent div to get the index. – karan3112 Aug 13 '14 at 11:51
0

I suggest a workaround.. see if it helps you. Add a hidden element inside the corresponding divs and add the variable names as text to it. I slightly modified your method get_id() to get the variable name from your divs hidden element.

function get_id()
{
   console.log($(this))
   var selVar= $(this).parent().find('input:hidden:first').text(); 
   alert('selector variable' + selVar);
}

this will work for you.

Khaleel
  • 1,212
  • 2
  • 16
  • 34
0

You could maybe guessing from the class of the element you click on it and use reflexivity.

To know the element you click on it, just use event.target where event is a variable passed in the click function. Look at this fiddle for an example.

The get_id method now looks like this:

function get_id(event) {
    console.log(event.target)
}

The value returned by event.target is the same as the value returned by the variable you declare it ($main_img1 or $main_img2).

facenord
  • 1
  • 1