MW211 EXIT

devlog
jQuery/追加直後にイベント発生
2017年02月13日
jQueryで「.append()」メソッドで追加した要素にイベントを仕込んでおいて
追加した直後に(初期表示のため)まず一回イベントを発生させる方法の例。
┌──────────────────────────────────────┐
│var newTd = $('<td>')                                                       │
│    .append($('<select>')                                                   │
│        .html(                                                              │
│            '<option value="0" selected="selected">-<\/option>'            │
│          + '<option value="1">○<\/option>'                                │
│          + '<option value="2">×<\/option>'                                │
│        )                                                                   │
│        .bind('change', function() {                                        │
│            if ($(this).val() == 0) {                                       │
│                $(this).closest('tr').css({'backgroundColor':'#C0C0C0'});   │
│            } else {                                                        │
│                $(this).closest('tr').css({'backgroundColor':'#FFFFFF'});   │
│            }                                                               │
│        })                                                                  │
│    );                                                                      │
│$('#tr').append(newTd);                                                     │
│newTd.ready(function() {                                                    │
│    $(this).change();                                                       │
│});                                                                         │
└──────────────────────────────────────┘
追加要素は非同期で追加が行われるためそれが完了した直後に(完了するまで待って)
イベントを実行させればよい。
待つためのものが「.ready()」メソッドである。
また、「.change()」メソッドを単独で実行すれば、
任意にchangeイベントを発生させることができる。
分類:jQuery