javascript - jQuery - 本当に私をクリックしたのは誰?

Question

私はこのjsbinを持っています（前の回答はあまり役に立ちませんでした）

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

ここに画像の説明を入力

checkbox私はクリックのリスナーを持っていますAlert...

ただし、をクリックすると、のイベントspanがトリガーされます。clickcheckbox

検出したい-実際にcheckBoxにアラートを実行させたのは誰ですか。

しかし！

I want : 最初にスパンをクリックした場合、アラート i was originally pressed by mySpan

そうしないと

最初にチェックボックスをクリックした場合、アラート 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グローバルフィールドまたはフラグソリューションを使用できます-これは望んでいません。

eparam - ソリューションを介して「データを移動」できることをうれしく思います。

ありがとう。：）

編集

jQuery はデータの移動をサポートしていますが、正しいコードを書くことができません

ここに画像の説明を入力

score 2 · Accepted Answer

これは私のために働きます、

<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>

フィドル

score 1 · Accepted Answer

これはどう。

$("#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

score 0 · Accepted Answer

$("#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/

score 0 · Accepted Answer

私はこのようなことをします：

$(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's a SPAN, let's 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にもあります。

score 0 · Accepted Answer

$("#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

score 0 · Accepted Answer

たぶん、このコードはあなたに役立ちます:

  $("#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') );
  });

score -1 · Accepted Answer

-1

使わない理由、

e.currentTarget

?

于 2012-05-21T09:03:35.387 に答える

javascript - jQuery - 本当に私をクリックしたのは誰?

編集

7 に答える 7

Related

Reference