jQueryで引数を取るJS関数の呼び出し方

このQ&Aのポイント
  • jQueryを使って、引数を取るJavaScript関数を呼び出す方法について教えてください。
  • 現在、引数を取る関数を別々の関数として作成し、条件によって呼び出す方法を使用していますが、より効率的な方法はありますか?
  • DRY原則を守りながら、jQueryで引数を取る関数を呼び出す方法について教えてください。
回答を見る
  • ベストアンサー

jQueryでの、引数を取るJS関数の呼出方法

jQueryの学習をしています。 HTML & JavaScriptで下記のように書かれているコード <input type=button id=button1 onclick=func_a() /> <script> function func1(){ //処理いろいろ } </script> は、jQueryを使って書くと、 $('#button1').live('click', func_a); このように書けます。 <input type=button id=button1 onclick=func_b(arg1, arg2) /> <script> function func_b(argument1, argument2){ //処理いろいろ } のように引数を取る関数は jQueryではどのように書けばよいのでしょうか? $('#button1').live('click', func_b(arg1, arg2)); とは書けなかったので、今は、 if (arg1 == xxx){ $('#button1').live('click', func_b_1_1); } else { $('#button1').live('click', func_b_1_2); } などのように引数別に同じような関数を創って書いています。 DRY原則という同じコードを二度書くなという約束もあるようなので、 きっといい方法があると思うのですが、 お詳しい方、教えていただけるとうれしいです。 どうぞ、よろしくお願いいたします。

質問者が選んだベストアンサー

  • ベストアンサー
  • Gotthold
  • ベストアンサー率47% (396/832)
回答No.1

単純には、 $('#button1').live('click',  function(){   func_b(arg1, arg2);  } ); ただ、arg1,arg2が変数の場合、 arg1,arg2を書き換えてしまうと イベント発生時に書き換えた後の値が参照されてしまします。 それが問題になるようであれば、もう一工夫必要。 素直なのは、  .live( events, data, handler(eventObject) ) を使うことでしょうか。(第2引数data経由でデータを渡せる) [参考] http://api.jquery.com/live/

Saotome_Haruka
質問者

お礼

ご回答、ありがとうございます。 きっといい方法があるんだろうって思っていたので、 とってもうれしいです。 もっともっと学習していいプログラムができるようになりたいです。 ありがとうございました。

関連するQ&A

  • JQueryでfunctionに引数としてIDを渡して処理する方法

    HTMLの制御にjQueryを使用しています。 functionに引数としてIDを渡して処理をしたいのですが、やりかたが分かりません。 テスト的にtest1Script、test2Scriptを作成しました。 test1と同様の結果を、引数にIDを渡すtest2Scriptでも得たいのですが、 失敗(1)や失敗(2)のように書いた場合、うまくいきません。何か良い方法はないでしょうか。ご教授下さい。 <script type="text/javascript"> function test1Script(){ alert($("#textfield1").val()); } function test2Script(objId){ //alert($("#objId").val()); 失敗(1) //alert($(#objId).val()); 失敗(2) } </script> </head> <body> <input type="text" id="textfield1" value="test1" /> <input type="button" id="button1" value="テスト1" onclick="test1Script();" /> <input type="button" id="button2" value="テスト2" onclick="test2Script('textfield1');" /> </body> </html>

  • jspでjavascript関数へ引数を渡す方法

    最近Webアプリの勉強をし始めたばかりの初心者です。 今、jspでjavascript関数へ引数を渡す方法がうまくいかず困っています。 以下はjspファイルの該当部分の抜粋です。 やりたいこととしては、画面上で参照ボタンを押したときに、"reference"という文字列を 一度javascript関数を介してサーブレットへ渡すということです。 <head> <script type="text/javascript"> <!-- function func(param){ alert(); document.getElementById("param").name = param; } // --> </script> </head> <form action="/tomcat_test/servlet/hello" method="POST"> <input type="hidden" name="param" id="param"> <input type="button" value="参照" onclick=<%= "func('reference')" %>/> </form> いろいろ調べてみたのですが、なかなかうまくいかずに困っています。 そもそも、参照ボタンを押してもonclickがうまく動いていないようで、 まずその問題を解決したいです。 onclickタグの使い方を間違っているのでしょうか。 よろしくお願い致します。

    • ベストアンサー
    • Java
  • jQueryのイベントに引数を渡したい

    例えば以下のような既存のJavaScriptのコードをjQueryのイベントで書き直したい場合、関数の引数で渡していた値は、どうやって渡すのでしょうか? 【html】 <a href="" onclick="func_a('abc'); return false;"></a> 【JavaScript】 faunction func_a(param_a){ alert(param_a); } 以下のようにすれば渡せないことはありませんが、かなり強引な感じがします。 【html】 <a href="" class="abc"></a> 【jQuery】 $(function() { $("a").click( function(){ var param = $(this).attr("class"); alert(param); return false; } ); }); こういう場合はjQeuryであっても、onclick属性で関数を呼び出すのが普通なのでしょうか? ご存知の方がいらっしゃいましたら教えてください。 よろしくお願い申し上げます。

  • WebBrowser 内のボタンをクリックし、引数を渡したい。

    WebBrowser 内のボタンをクリックし、引数を渡したい。 WebBrowser コントロールを使用していて Windows アプリからページ内のボタンをクリックする方法について質問です。 以下のボタンが html で定義されているとして、 <input type = "button" id = "button1" onclick="javascript:foo();" /> HtmlElement element = null; element = webBrowser1.Document.GetElementById("button1"); element.InvokeMember("click"); こうすると、javascript の foo() が実行されます。 本題はここからなんですが、 この関数fooに引数を渡したいのです! 例えばfooの定義を var foo=function(arg) { alert(arg); } として、アプリ側から、 element.InvokeMember("click","this is test"); のようにすれば動くかと思ったのですが、だめでした。 方法をご存知のかた、ご教授願います!

    • ベストアンサー
    • HTML
  • jqueryのajaxに引数を指定

    ajaxを利用して外部HTMLを読み込ませたいのですが$.ajax()などをonclickイベントなどで呼び出すとき引数を指定してurlを設定することはできませんか イメージとしては 例えばjqueryでloadingpageという関数を作って HTMLを <input type="button" onclick="loadingpage(http://www.hogehoge.com);"> って感じにしてボタンをクリックするとhttp://www.hogehoge.comがページ内で読みだされるようにしたいです。

  • jsについて

    jsのプログラムで質問があります。 p id1を押したらテスト1が表示されますが、p id2を押したら1が表示されたまま2が表示されてしまいます。 2を押したら1を隠して2を表示させたいのですが、やり方を教えてください。 3も、同じようにしたいです。 <p id="p1">テスト1</p> <p id="p2">テスト2</p> <p id="p3">テスト3</p> <input type="button" id="button1" value="ボタン1" /> <input type="button" id="button2" value="ボタン2" /> <input type="button" id="button3" value="ボタン3" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script> $(function() { // 初期表示を非表示にする $('#p1').hide(); // 初期表示を非表示にする $('#p2').hide(); // 初期表示を非表示にする $('#p3').hide(); $("#button1").click(function() { // 表示する $("#p1").show(); }); $("#button2").click(function() { // 表示する $("#p2").show(); }); $("#button3").click(function() { // 表示する $("#p3").show(); }); }); </script>

  • 引数付きで呼び出す関数・配列・name(id)のつけ方・・・?

    引数付きで呼び出す関数・配列・name(id)のつけ方・・・? 何を質問したいのかわからないタイトルになってしまいましたが とりあえず下のソースコードを見てください(実行してください)。 <html> <head><title>up</title> <script language="JavaScript"> <!-- num=new Array("5","5"); str=new Array("*****","*****"); function up(j) { num[j]++; str[j]+="*"; text[j].innerHTML=num[j]+str[j]; } //--> </script> </head> <body> <input type="button" value="1" onClick="up(0)"><div id="text1">5*****</div><br> <input type="button" value="2" onClick="up(1)"><div id="text2">5*****</div> </body> </html> 1のボタンを押すと上の文字列が反応し、2のボタンを押すと 下の文字列が反応するプログラムを書きたいのですが、どっちの ボタンを押して関数が呼び出され、どっちの文字列に処理を するか区別することができません、どうしたらよいのでしょうか? 下のようにひとつの時はできました・・・。でもふたつの時は どうしたらいいのかわかりません。 <html> <head><title>up</title> <script language="JavaScript"> <!-- num=5; str="*****"; function up() { num++; str+="*"; text1.innerHTML=num+str; } //--> </script> </head> <body> <input type="button" value="1" onClick="up()"><div id="text1">5*****</div> </body> </html>

  • 初心者です。Java scriptでの引数の使いかたについての質問です

    初心者です。Java scriptでの引数の使いかたについての質問です 初心者です。Java scriptでの引数の使いかたについての質問です。下記でやりたいことは、 requestText関数の引数02とか03を、java script なかの httpのアドレスの中のabに記入するには どうしたらいいかということです。あるいは、そうしたことが出来るのでしょうか。 <input type="button" value="02" onclick="requestText(02)"> <input type="button" value="03" onclick="requestText(03)"> function requestText(ab){ var ajax = new Ajax.Request("http://www.geocities.jp/abate/ab.html", {method: "GET", onSuccess: gotData}); function gotData(xmlhttp) { document.getElementById("a02").innerHTML = xmlhttp.responseText; } }

  • onClickで関数呼出し後に、結果に応じてsubmitを実行する方法

    JavaScriptで、 function func() {  if (a==0) {   alert("処理しない");   return false;  }  return true; } と、a=0ならfalseを返し、それ以外ならtrueを返す関数を定義しています。 そして、FORMタグで <FORM NAME="FormName" ACTION="next.html"> <INPUT TYPE="button" VALUE="next" NAME="button1" onClick="return func();submit();"> </FORM> と記述しています。 要は、ボタンを押下した際にfunc関数がtrueを返せば、next.htmlに 遷移させたいのですが、上記記述では、遷移しません・・・ onClick部分にonClick="return func(),submit();"と記述した場合、 func関数の実行結果がtrueでもfalseでも遷移してしまいます。 そこで、なんとなくonClick="return func()&&submit();"と記述してみたところ、 func関数がtrueの時のみうまく遷移するようになりました。 これは偶然そう動作しているのでしょうか、それとも上記は正しい記述方法なのでしょうか? 正しい記述方法ならいいのですが、上記以外に正式な記述方法があれば 教えていただけないでしょうか? ※TYPE="submit"にすればいいとは思うのですが、buttonで実現したいと 考えております。

  • fortran90 引数で渡された関数の呼び出し

    fortran90を始めて間もない者です。 メインプログラムより呼び出しているサブルーチンにユーザ関数を渡しています。 このサブルーチンを自前で作成するのが目的です。 引数で受け取った関数を、自前の別関数より呼び出すにはどうしたら良いでしょうか。 Cであれば関数のポインタをグローバルな変数にセットしてやれば可能だと思いますが・・・ !-------------------------------- subroutine sub(func1, a) real::a interface real function func1(x) real::x end function func1 real function func2(x) real x end function func2 end interface call sub2(func2, a) write(*,*) a return end subroutine sub !-------------------------------- real function func2(x) real::func2, x ! ここでfunc1を呼び出したい ! func2=func1(x) end function func2 !-------------------------------- subroutine sub2(funca, a) real::a interface real function funca(x) real::x end function funca end interface a=funca(10.) return end !-------------------------------- program main external func real a call sub(func, a) write(*,*) a end program !-------------------------------- function func(x) real func, x func=2.*x*x end function func

専門家に質問してみよう