scala jsのテキストボックスの変更を追跡する

Question

私はhtmlファイルにテキストボックスを持っており、ユーザーがその値を変更してその更新値も決定するたびに検出したいと考えています。テキストボックスのHTMLコードは次のとおりです。

<input type="text" name="amount" id="amount" value="0" onchange="Demo().change(id,value)"> 

と私のScalaのファイルで、私のように関数「変更」を実装しました：

@JSExport 
def change(id:String):Unit={ 
appendPar(document.body,"Text Box value is changed and the new value is : "+document.getElementById(id).getAttribute("value")) 
} 

しかし、それは私の場合には機能していません。私はここで間違って何をしていますか？ 提案がありますか？

UPDATE：テキストボックスの値を変更した後にEnterキーを押したときだけイベントを発生させます。さらに、更新された値を「0」として表示している。私はそれを私の定義済みの値の代わりにテキストボックスから取得させることができますか？

Answer 1

あなたはonkeyハンドラの1つを使用する必要があります。たとえば、ユーザが矢印キーで動き回る場合

注IIRCつまり、これもトリガーされます。あなたは本当にそれが変更された場合にのみ呼び出されるようにしたいのであれば、あなたは変数を導入してチェックする必要があります：あなたは= 9 IE <を無視することができるかどう

var lastValue: String = "" 

@JSExport 
def change(id:String): Unit = { 
    val newValue = document.getElementById(id).getAttribute("value") 
    if (lastValue != newValue) { 
    appendPar(document.body, 
     "Text Box value is changed and the new value is : " + newValue) 
    lastValue = newValue 
    } 
} 

Answer 2

があなたの代わりにchangeのinputイベントを使用することができます。

又は要素の値がMDNから

を変化させたときのDOM入力イベントが同期し焼成します。

テキスト以外のテキスト入力（チェックボックス、ラジオボタンなど）では、ブラウザの互換性に関する追加の注意事項がありますが、その場合はchangeイベントを使用することができます。詳細は、http://caniuse.com/#search=inputを参照してください。

---

また、変数idがどこから来ているのかわかりません。 の代わりに文字列"amount"を渡す必要があります（Demo().change("amount")など）。それはまったく再利用不可能ですが、少なくとも機能するはずです。

このメソッドをより汎用的にするには、javascriptがすべてのイベントハンドラにEventオブジェクトを渡し、イベントが発生したHTML要素を含むtargetキーがあることに注意してください（この場合、テキストエリア）。あなたは簡単にvalueそのtargetを取得することができます。

これが混乱する場合は、まずJSでこれを実装してから、これをScalaに変換することをお勧めします。あなたは同時に両方の戦線で戦って欲しくない。