16

script_1.jsとscript_2.jsという2つの外部javascriptファイルを組み込んだhtmlページがあるd3でプロジェクトを書いています。
select 要素の変更イベントのために、script_1.js から 1 つのイベント リスナーを登録し、script_2.js から別のイベント リスナーを登録する必要があります。現在、htmlに次の行があります。

<select id="timebasis" class="selector" onchange="selectIndexSp(this),selectIndexBt(this)">

ここで、selectIndexSp(object)とselectIndexBt(object)はそれぞれ script_1.js と script_2.js で定義されています。私はこのアプローチがまったく好きではありません.htmlファイルではなくd3で同じタスクを実行する方法を知りたいのですが、これは良い習慣ではありません。

前もって感謝します！

4

1 に答える 1

38

次のように、イベント名に名前空間を追加できます。

d3.select("#timebasis")
    .on("change.sp", listenersp)
    .on("change.bt", listenerbt);

参照: https://github.com/mbostock/d3/wiki/Selections#wiki-on

選択した要素の同じタイプのイベント リスナーがすでに登録されている場合、新しいリスナーが追加される前に、既存のリスナーが削除されます。同じイベント タイプに複数のリスナーを登録するには、タイプの後に「click.foo」や「click.bar」などのオプションの名前空間を続けることができます。リスナーを削除するには、null をリスナーとして渡します。

関数には、現在のデータムdとインデックスが渡さiれ、thisコンテキストが現在の DOM 要素として渡されます。2 つの関数が DOM 要素を引数として期待しているように見えますか? その場合、次のようになります。

d3.select("#timebasis")
    .on("change.sp", function() { selectIndexSp(this); })
    .on("change.bt", function() { selectIndexBt(this); });
于 2013-02-07T14:37:54.703 に答える