1

私の HTML には、次のような多くのオブジェクトが含まれています。

<div class="class">
  <div class="disconnect_btn">Click here</div>
  <input type="hidden" name="ID" value="12"/>
</div>

別の関数をボタン要素にバインドする関数があります。このような:

$('.disconnect_btn').bind('click',function(e){
    disconnectFunction(e);
});

私がやりたいことは、ボタンがあるDivを最初に取得することです。e.parents('.class')メソッドを使用しようとしましたが、これは常にオブジェクトにメソッドがないようなエラーを返します...私の2番目のターゲットは、非表示の入力フィールドから値属性を抽出することです親部門

function disconnectFunction(e){
    var parent = e.parents('.class'));  //returns error
    var ID = parent.find('input:hidden[name=ID]').attr('value');
    console.log( ID );
}

this および $(this) セレクターも試しましたが、どういうわけか行き詰まりました。おそらく、見つけられない簡単な解決策があります。

4

7 に答える 7

4

DOM を渡す代わりに、イベントを引数として渡します。

以下のようにして、イベントから渡すことができます。

$('.disconnect_btn').on('click',function(e){
    disconnectFunction(e.target);
});

disconnectFunction では、以下のように使用できます。

function disconnectFunction(e){
    var parent = $(e).parents('.class'));  //returns error
             ---^^^^^-----
    var ID = parent.find('input:hidden[name=ID]').attr('value');
    console.log( ID );
}
于 2013-04-26T06:48:05.877 に答える
1

イベント オブジェクトではなく、現在のオブジェクトを渡す必要があります。また、on('events') メソッドを使用して、イベントを dom 要素にアタッチしてください。

可能性

  1. 現在のオブジェクトを渡すことができます
  2. Event.Target プロパティを介して Event オブジェクトの現在のオブジェクトにアクセスできます。
  3. 関数でこのオブジェクトにアクセスできます。

    $('.disconnect_btn').on('click',function(e){
       disconnectFunction(this);
    });
    
     function disconnectFunction(currObj){
       var parent = $(currObj).parents('.class'));  
       var ID = parent.find('input:hidden[name=ID]').attr('value');
        console.log( ID );
    }
    

または、関数でこのオブジェクトにアクセスすることもできます

function disconnectFunction(e){
        var parent = $(this).parents('.class'));  //here this refer to clicked object
         var parent = $(e.Target).parents('.class'));  //Using event.Target Property
        var ID = parent.find('input:hidden[name=ID]').attr('value');
        console.log( ID );
    }
于 2013-04-26T06:45:27.970 に答える
1

これを行うだけです:

$('.disconnect_btn').on('click',function(e){
    disconnectFunction($(e.target));  // <== Pass $(e.target) or $(this), in place of e
});

function disconnectFunction(e){
    var parent = e.parents('.class'); // <== Remove a extra bracket here..  
    var ID = parent.find('input:hidden[name=ID]').val();
    console.log( ID );
}
于 2013-04-26T06:50:24.460 に答える
1

event問題は、HTML オブジェクトではなく、オブジェクトを使用しようとしていることです。

$('.disconnect_btn').bind('click',function(e){
    // `e` refers to event object received by the callback function
    // `this` refers to the HTMLElement that was clicked
    // $(this) turns `this` (which is HTMLElement object) to `jQuery` object
    disconnectFunction($(this)); // this will do the trick
    // now, you can use `e` parameter inside disconnectFunction
    // as a `jQuery` object which has `parents` method defined
});
于 2013-04-26T06:45:45.710 に答える
0

これを試して

$('.disconnect_btn').bind('click',function(e){
    disconnectFunction($(this));
});

function disconnectFunction(e){
    var parent = $(this).parents('.class');
    var ID = parent.find('input:hidden[name=ID]').attr('value');
    console.log( ID );
}
于 2013-04-26T06:48:22.450 に答える
0

e.targetクリックされた要素を取得するために使用するe、イベント オブジェクトです。.closest()また、 class で最初の親を取得するために使用できますclass

別の注意:入力フィールドの値を取得するには、.attr() を使用する代わりに.val ()を使用してください。

function disconnectFunction(e){
    var parent = $(e.target).closest('.class'));  //returns error
    var ID = parent.find('input:hidden[name=ID]').val();
    console.log( ID );
}

別の解決策は、クリックされた要素をに渡すことですdisconnectFunction

function disconnectFunction(el){
    var parent = $(el).closest('.class'));  //returns error
    var ID = parent.find('input:hidden[name=ID]').val();
    console.log( ID );
}

それから

$('.disconnect_btn').bind('click',function(e){
    disconnectFunction(this);
});
于 2013-04-26T06:47:29.420 に答える
0

あなたはそのように使用します:

var parent = e.parents('.class'));  //returns error

そのように使用します:

var parent = $(e).parents('.class');  
于 2013-04-26T06:47:09.043 に答える