Друзья, кто умеет писать правильно и красиво, подскажите как лучше писать такие вещи и от чего нужно отталкиваться при выборе решения. Допустим есть модальное окошко, там динамически формируется контент с кнопочками "btn1", "btn2", "btn3". Модальное окошко #modal, уже есть на странице и скрыто. Задача: прописать обработку клика на эти кнопочки. Лично я вижу два вариант и не пойму, что выбрать и на что нужно смотреть чтобы принять решение.
Вариант 1:
$('#modal').on('click', '.btn1', function(e) {
// Some action
});
$('#modal').on('click', '.btn2', function(e) {
// Some action
});
$('#modal').on('click', '.btn3', function(e) {
// Some action
});
Не нравится: - Дублирование конструкции
Вариант 2:
$('#modal').on('click','.some-common-btn-class' ,function(e){
var typeBtn = $(e.target).attr('some-unique-property');
switch (typeBtn) {
case 'type1':
// some action
break;
case 'type2':
// some action
break;
case 'type3':
// some action
break;
}
});
Не нравится: - Необходимость в дополнительном классе .some-common-btn-class - Логика принятия решения внутри обработчика
Вообщем у кого какие варианты, делитесь :)