web-dev-qa-db-ja.com

jQuery .click - ユーザ関数にパラメータを渡す

私はjQueryの.clickを使用してパラメータで関数を呼び出そうとしていますが、私はそれを働かせることができません。

これは私がそれを機能させる方法です。

$('.leadtoscore').click(add_event('shot'));

どの呼び出し

function add_event(event) {
    blah blah blah }

私がこのようにパラメータを使用していなくても動作します。

$('.leadtoscore').click(add_event);
function add_event() {
    blah blah blah }

しかし、私は自分のadd_event関数にパラメータを渡すことができる必要があります。

どのように私はこの特定のことをすることができますか？

私は.click(function() { blah }を使うことができることを知っていますが、私はadd_event関数を複数の場所から呼び出して、それをこのようにしたいのです。

jqueryfunctionparameter-passing
263
Paul Hoffer

徹底的に言えば、私はjQuery クリックイベントハンドラのバージョン1.4.3で導入された機能の一部である別の解決策に出会いました。

最初のパラメータとしてjQueryによってイベントハンドラ関数に自動的にフィードバックされるイベントオブジェクトにデータマップを渡すことができます。データマップは最初のパラメータとして.click()関数に渡され、その後にイベントハンドラ関数が続きます。

これが私の言っていることを説明するためのコードです。

// say your selector and click handler looks something like this...
$("some selector").click({param1: "Hello", param2: "World"}, cool_function);

// in your function, just grab the event object and go crazy...
function cool_function(event){
    alert(event.data.param1);
    alert(event.data.param2);
}

私はそれがこの質問のためにゲームの後半にあることを知っています、しかし前の答えは私にこの解決策を導きました、それで私はいつか誰かに役立つことを願っています！

480
Chris Kempen

次のような匿名関数を使用する必要があります。

$('.leadtoscore').click(function() {
  add_event('shot')
});

この例のように、関数名withoutパラメータだけで呼び出すことができます。

$('.leadtoscore').click(add_event);

ただし、add_eventメソッドはパラメーターとして'shot'を取得しませんが、clickがeventオブジェクト自体であるコールバックに渡すものは何でも...適用可能この場合ですが、他の多くの場合にも機能します。パラメーターを渡す必要がある場合は、匿名関数を使用するか、またはotherオプションが1つあり、 .bind() を使用して、次のようにデータを渡します。

$('.leadtoscore').bind('click', { param: 'shot' }, add_event);

そして、次のようにadd_eventでアクセスします。

function add_event(event) {
  //event.data.param == "shot", use as needed
}
77
Nick Craver

あなたがそれをあなたがそれを持っていた方法と呼ぶならば...

$('.leadtoscore').click(add_event('shot'));

... add_event()が関数を返すようにする必要があります。

function add_event(param) {
    return function() {
                // your code that does something with param
                alert( param );
           };
}

関数が返され、.click()の引数として使用されます。

34
user113716

私は.on（）を次のように使用して成功しました。

$('.leadtoscore').on('click', {event_type: 'shot'}, add_event);

それからadd_event関数の中であなたは次のように 'shot'へのアクセスを得ます：

event.data.event_type

詳細については、 。on（）のドキュメント を参照してください。次の例があります。

function myHandler( event ) {
  alert( event.data.foo );
}
$( "p" ).on( "click", { foo: "bar" }, myHandler );
23
Gravity Grave

はい、これは古い投稿です。とにかく、誰かがそれが役に立つと思うかもしれません。これは、イベントハンドラにパラメータを送信するもう1つの方法です。

//click handler
function add_event(event, paramA, paramB)
{
    //do something with your parameters
    alert(paramA ? 'paramA:' + paramA : '' + paramB ? '  paramB:' + paramB : '');
}

//bind handler to click event
$('.leadtoscore').click(add_event);
...
//once you've processed some data and know your parameters, trigger a click event.
//In this case, we will send 'myfirst' and 'mysecond' as parameters
$('.leadtoscore').trigger('click', {'myfirst', 'mysecond'});

//or use variables
var a = 'first',
    b = 'second';

$('.leadtoscore').trigger('click', {a, b});
$('.leadtoscore').trigger('click', {a});
9
Kevin
      $imgReload.data('self', $self);
            $imgReload.click(function (e) {
                var $p = $(this).data('self');
                $p._reloadTable();
            });

JavaScriptオブジェクトをonclick要素に設定します。

 $imgReload.data('self', $self);

this要素からObjectを取得します。

 var $p = $(this).data('self');
5
Vladimir Novick

私は簡単な解決策を得ます：

 <button id="btn1" onclick="sendData(20)">ClickMe</button>

<script>
   var id; // global variable
   function sendData(valueId){
     id = valueId;
   }
   $("#btn1").click(function(){
        alert(id);
     });
</script>

私が意味するのは、値onclickイベントをjavascript function sendData()に渡し、変数に初期化し、それをjqueryイベントハンドラメソッドに渡すことです。

最初にsendData(valueid)が呼び出されて値を初期化するので、これは可能です。その後、jqueryイベントの後に実行され、その値を使用します。

これは簡単な解決策であり、詳細な解決策は ここ に行きます。

2
susan097