click here  
   
Geek asks and answers

JQuery - who actually clicked me?

I have jsbin (prev answers nothing helped) 

<span id="mySpan" > click here </span>
  <br/> 
  <input id="myCb" type="checkbox"/>

enter image description here

I have a listener for checkboxclick that does Alert...

However, pressing spantriggers an event clickfor checkbox.

I want to find out who really did checkBox to execute the warning.

But !

I want: if you first click on the span, warn i was originally pressed by mySpan

else

if you clicked the check box first, notify i was originally pressed by myCb

$("#mySpan").on('click',function (e) 
  {
    $("#myCb").trigger('click');

  });

$("#myCb").on('click',function (e) 
  {
    doWork(e)
  });


function doWork(e)
{
  alert('i was originally pressed by '+$(e.delegateTarget).attr('id') );
 }

ps I can use a global field or a flag solution that I DO NOT WANT.

I will be happy to have a "data move" with the parameter e.

thank:).

change

jQuery supports data transfer, but I cannot write the correct code

enter image description here

+3
7

.

$("#mySpan").on('click',function (e) 
  {

    $("#myCb").trigger(e);

  });

$("#myCb").on('click',function (e) 
  {
    doWork(e);
  });


function doWork(e)
{
  alert('i was originally pressed by '+$(e.target).attr('id') );
 }

, .

http://jsbin.com/ixanup/2/edit#javascript,html

+1

,

<html>
<head>
<style>

</style>
<script src='jquery.js'></script>
<script type='text/javascript'>
    $(document).ready(function() {
        $("#mySpan").on('click',function (e){
            $("#myCb").trigger('click','span');
        });

        $("#myCb").on('click',function (e,span){
            var ele = span || 'cb'; 
            doWork(ele);
        });
        function doWork(ele){
          alert('i was originally pressed by ' + ele  );
         } 
    })


</script>
</head> 
<body>
  <span id="mySpan"   style="width:100px;height:100px;" > click here </span>
  <br/><br/><br/>
  <input id="myCb" type="checkbox"/>
</body>
</html>

Fiddle

+2
$("#mySpan, #myCb").on('click', function (e) {
    alert('I was originally pressed by ' + e.target.id);
    console.log($(e.target)); /* jQuery reference to the clicked element */

    if (e.target.id === 'myCb') {
       /* do code only if checkbox was clicked */
    }
});

: http://jsfiddle.net/4AVZz/

0

, :

  $("#mySpan").on('click',function (e) 
  {
    alert('i was originally pressed by '+$(e.delegateTarget).attr('id') );
    if($("#myCb").attr('checked')=="checked")
        $("#myCb").removeAttr('checked');
    else
        $("#myCb").attr('checked','checked');

  });

  $("#myCb").on('click',function (e) 
  {
    alert('i was originally pressed by '+$(e.delegateTarget).attr('id') );
  });
0
$("#mySpan").on('click',function () {
        var cb = $("#myCb");
        if(cb.is(':checked')) {
            cb.removeAttr('checked');
        } else {
            cb.attr('checked', true);
        }
        doWork.apply($(this));
      });

    $("#myCb").on('click',function (e) {
        doWork.apply($(this));
    });
    function doWork(e) {
        console.log('i was originally pressed by '+$(this).attr('id') );
        alert('i was originally pressed by '+$(this).attr('id') );
    }

. .

, . http://jsbin.com/axaqer/7/edit

0

- :

$(function() {

  $('.row span, .row input[type="checkbox"]')
    .on('click', function (evt) {

      triggerCheckbox($(this), evt.currentTarget.tagName);
      doWork(evt.currentTarget.tagName);
  });

});

function doWork(elm) {
  // elm with either be INPUT or SPAN
  console.log('I was originally pressed by ' + elm);
}

function triggerCheckbox(elm, evt) {  
  // if it a SPAN, let change the checkbox value without
  //  triggering the click event
  if(evt.currentTarget.tagName === 'SPAN') {
    var ckb = $(elm).closest('.row').find('input[type="checkbox"]');
    $(ckb).prop('checked', !$(ckb).prop('checked'));
  }
}

, ID, , , .

HTML, <div>, , :

  <div class="row">

    <span id="mySpan">click here</span>
    <br/><br/><br/>
    <input id="myCb" type="checkbox"/>

  </div>

JsBin.

0

,

e.currentTarget

?

-1

More articles:


All Articles