#internet-explorer-8 #events #mootools #delegation
#internet-explorer-8 #Мероприятия #mootools #делегирование
Вопрос:
Итак, у меня есть поле списка рядом с формой. Когда пользователь нажимает на опцию в поле выбора, я делаю запрос на соответствующие данные, возвращаемые в объекте JSON, который помещается в элементы формы. Когда форма сохраняется, запрос выполняется, и поле списка перестраивается с обновленными данными. Поскольку он перестраивается, я пытаюсь использовать делегирование в родительском div listbox для кода onchange. Проблема, с которой я сталкиваюсь, заключается в том, что IE8 (большой шок) не запускает делегированное событие.
У меня есть следующий HTML:
<div id="listwrapper" class="span-10 append-1 last">
<select id="list" name="list" size="20">
<option value="86">Adrian Franklin</option>
<option value="16">Adrian McCorvey</option>
<option value="196">Virginia Thomas</option>
</select>
</div>
и следующий скрипт для этого:
window.addEvent('domready', function() {
var jsonreq = new Request.JSON();
$('listwrapper').addEvent('change:relay(select)', function(e) {
alert('this doesn't fire in IE8');
e.stop();
var status= $('statuswrapper').empty().addClass('ajax-loading');
jsonreq.options.url = 'de_getformdata.php';
jsonreq.options.method = 'post';
jsonreq.options.data = {'getlist':'<?php echo $getlist ?>','pkey':$('list').value};
jsonreq.onSuccess = function(rObj, rTxt) {
status.removeClass('ajax-loading');
for (key in rObj) {
status.set('html','You are currently editing ' rObj['cname']);
if ($chk($(key))) $(key).value = rObj[key];
}
$('lalsoaccomp-yes').set('checked',(($('naccompkey').value > 0)?'true':'false'));
$('lalsoaccomp-no').set('checked',(($('naccompkey').value > 0)?'false':'true'));
}
jsonreq.send();
});
});
(Я убрал немного несвязанного материала). Итак, все это работает, как ожидалось, в Firefox, но IE8 отказывается запускать событие делегированного изменения для элемента select. Если я подключу функцию изменения непосредственно к select, то она будет работать просто отлично.
Я что-то упускаю? IE8 просто не нравится :relay?
Примечание: я новичок в mootools, javascripting и т.д., Поэтому, если есть что-то, что можно улучшить с помощью кода, пожалуйста, дайте мне знать.. Спасибо!
Комментарии:
1. Ах.. Спасибо, Оскар. ок .. Осмотревшись, я обнаружил, что нужно добавить класс в список и вместо этого прикрепить событие к селектору классов.. НО, похоже, IE не понимает событие изменения, поэтому установка <select class=»listbox»>, а затем addEvent(‘change:relay(.listbox)’ …) по-прежнему не работает в IE (хотя FF работает просто отлично). Событие click работает в обоих случаях, но я бы хотел, чтобы опция указывала стрелкой на параметры списка, а не просто нажимала. Есть ли КАКОЕ-либо решение, которое будет работать в обоих браузерах и при этом предоставлять полную функциональность? Спасибо.
Ответ №1:
Делегирование элемента не будет работать с элементами поля (input / select / textarea) в IE.