1

JSP マークアップによって参照される別の JavaScript モジュールを定義するときに、最新の Dojo1.9 AMD のベスト プラクティスに従おうとしています。以前は、同じ JSP ファイル MyJayEsspEe.jsp に大きな javascript セクションがありました。この javascript セクションは、さまざまな要素の onClick プロパティによって呼び出される関数を定義していました。ここで、Dojo 定義メカニズムを使用して、JavaScript を MyCallbacks.js という名前の新しいファイルに分離しています。

MyCallbacks.js の形式は次のようになります。

define(["dojo/dom", "dojo/dom-style", "dojo/has", "dijit/registry", "dojo/on"], 
 function (dom, domStyle, dojoHas, registry, on) {
...
   function clickedOnButton1() {
      console.log("Clicked on button1");
   }
   function clickedOnLinkTwo() {
      console.log("Clicked on second link");
   }
...    
   return {
      clickedOnButton1: clickedOnButton1,
      clickedOnLinkTwo: clickedOnLinkTwo
   }
});

MyJayEsspEe.jsp ファイルには、現在、次のような醜いマークアップが含まれています。

...
    <button data-dojo-type="dijit/form/Button" type="button" onclick="require(['commonjs/MyCallbacks'], function(mycallbacks) {mycallbacks.clickedOnButton1();});">First Button</button>

    <a id="testLinkId" href="#" onclick="require(['commonjs/MyCallbacks'], function(mycallbacks) {mycallbacks.clickedOnLinkTwo();});">Link Two</a>
...

しかし、モジュールを定義して、マークアップで次のようなクリーンなコールバックを使用できるようにする方法があることを願っています。

...
    <button data-dojo-type="dijit/form/Button" type="button" onclick="mycallbacks.clickedOnButton1();">First Button</button>

    <a id="testLinkId" href="#" onclick="mycallbacks.clickedOnLinkTwo();">Link Two</a>
...

モジュールとコールバックを定義するための Dojo リファレンス ドキュメントを確認してきましたが、これまでのところ、私が探しているクリーンなソリューションへのポインターは見つかりませんでした。私が使用しているものよりもクリーンなソリューションはありますか?

時間をありがとう、グレゴール

4

2 に答える 2

0

ベスト プラクティスとして、ウィジェット自体の動作をカプセル化することを常にお勧めします。ウィジェットが処理することになっているすべてのコールバックは、ウィジェット内で定義する必要があります。1 つのモジュールですべてのコールバックを定義すると、モジュールのモジュール性と移植性が損なわれます。

あなたの質問に答えるには：

<script>
    require(['dojo/dom', 'dojo/on', 'commonjs/MyCallbacks'], function(dom, on, MyCallbacks) {
      // register all event handlers here
      on(dom.byId('testLinkId'), 'click', MyCallbacks.clickedOnLinkTwo);
    });
</script>

<a id="testLinkId" href="#">Link Two</a>
于 2013-11-01T04:42:57.217 に答える