0

可変数のドラッグ可能な要素を反復処理する for ループがあり、それぞれに対して停止イベント コールバックを作成します。コールバック関数は、リンク先のアイテムのインデックスを知る必要があります。

クロージャの問題と思われるものに遭遇しました。コールバックが起動されると、コールバックに渡されるループ イテレータ インデックス変数の状態 (_x) は、値ではなく、ループ イテレータ インデックスの最後の値になります。コールバック関数が定義された時点でのそのイテレータ インデックスの。以下のいくつかのコーヒースクリプト:

for _x in [0..total]
  $(window).ready $(".draggable-#{_x}").draggable
    cursor: 'move'
    handle: ".draggable-image-move-button-#{_x}"
    containment: 'div#banner-builder-preview'
    stop: =>
      alert "x === #{_x}"

上記の例では、アラート プロンプトは常に「x === 0」、「x === 1」などではなく、「x === total+1」を出力します。

停止イベントを持つ各要素のコールバックに一意のインデックスを渡す最善の解決策は何ですか? コールバックから起動された要素からより多くのデータを取得するために、さらに別のjqueryセレクターに頼らずにこれを行うことをお勧めします。

アップデート:

私が現在直面している別の問題: for ループ内の私のコールバックは、ファイルで定義された他の関数を認識できません。for ループを使用して匿名のコールバック関数を作成する前に定義が行われたとしても、それは非常に奇妙だと思います。

例えば:

for _x in [0..total]
  do (_x) ->
    $(window).ready $(".draggable-#{_x}").draggable
      cursor: 'move'
      handle: ".draggable-image-move-button-#{_x}"
      containment: 'div#banner-builder-preview'
      stop: =>
        someFunction _x  # ... this line throws an exception, not defined
        alert "x === #{_x}
4

1 に答える 1

1

問題は、コールバックが次のことです。

stop: =>
  alert "x === #{_x}"

すべて参照することになりますが、呼び出されるまで_x評価しません。_xそれが起こる時までに、_xは値を持っていますtotal + 1。これは非常に一般的な問題であるため、CoffeeScript には役立つdoキーワードがあります。

JavaScript ループを使用して関数を生成する場合、ループ変数が確実に閉じられるようにするためにクロージャー ラッパーを挿入するのが一般的であり、生成されたすべての関数が最終的な値を共有するだけではありません。CoffeeScript はdoキーワードを提供します。このキーワードは、渡された関数をすぐに呼び出し、引数を転送します。

したがって、代わりに次のように言うことができます。

for _x in [0..total]
  do (_x) ->
    $(window).ready $(".draggable-#{_x}").draggable
      #... as before
于 2013-07-22T22:19:40.320 に答える