質問
Riot.jsのカスタムタグファイルに定義した、selectのchangeイベントを、
独立させたいのですが、そのやり方が分かりません。
例えば、以下のカスタムタグを定義したとします。
※selectには、materializeを利用しています。
tag
1<mytag> 2 3 <div> 4 <select> 5 <optgroup label="term 1"> 6 <option value="3" selected="{opts.select == '3'}">opt1</option> 7 <option value="2" selected="{opts.select == '2'}">opt2</option> 8 <option value="-1" selected="{opts.select == '-1'}">opt3</option> 9 </optgroup> 10 <optgroup label="term 2"> 11 <option value="1" selected="{opts.select == '1'}">opt4</option> 12 <option value="0" selected="{opts.select == '0'}">opt5</option> 13 </optgroup> 14 </select> 15 </div> 16 17 18 19 20 <script> 21 this.on('update', function() { 22 $('select').material_select(); 23 }); 24 25 this.on('mount', function() { 26 $('select').material_select(); 27 }); 28 29 $("select").change(function(){ 30 var $text = $(this, "option:selected").val(); 31 alert($text); 32 }); 33 34 35 </script> 36 37 38 39</mytag> 40
これをHTML側で、
html
1<mytag></mytag> 2<mytag></mytag> 3<mytag></mytag>
と、3回呼び出したとすると、
3つのselectボックスが生成されます。(以下の図)
Firefox 50.0.2 で確認したところ、
一つ目のselect
ボックスの選択を変更すると、
2回alert
が表示され、
2つ目のselect
ボックスの選択を変更したところ、
1回alert
が表示され
3つ目のselect
ボックスの選択を変更したところ、
alert
は表示されませんでした。
それぞれの処理を独立させようと、
tagファイルの中のJavaScriptに
javascript
1$("select").change(function(){ 2 var $text = $(this, "option:selected").val(); 3 alert($text); 4});
を書いたのですが、うまく行っておりません。
この表記は間違っているのでしょうか?
間違っているとして、正解はどうなのでしょうか?
ご存じの方がいらっしゃいましたら、ご教示頂けると幸いです。
よろしくお願いいたします。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/12/15 09:21
2016/12/15 09:37
2016/12/15 13:41
2016/12/15 14:08
2016/12/15 16:54