Нужен ли IE элемент для вставки в DOM, прежде чем узнать его свойства? - PullRequest
3 голосов
/ 29 апреля 2011


Я надеюсь, что это не повторяющийся вопрос, но быстрый поиск не дал мне никаких результатов.
Мне нужно создать элемент <select multiple="multiple"> динамически, используя такие данные:

var _options = [
    {
        MaterialCombined: '123 - asd',
        MaterialName: '123'
    },{
        MaterialCombined: '143123 - asdqw',
        MaterialName: '143123'
    }
];

Теперь следующий код отлично работает в браузерах! = IE

var select = new Element('select ', {'multiple ': 'multiple ','size ': ((_options.length > 5) ? 5 : _options.length),'class ': 'AF_ddl ','style ': 'width: 250px'});

for (var i = 0; i < _options.length; ++i) {
    var option = new Element('option ').update(_options[i].MaterialCombined);
    option.value = _options[i].MaterialName;
    select.options.add(option);
}

Но в IE он выдает исключение при попытке вызвать add() для свойства select.options. Это почему? Нужно ли IE вставлять select в DOM, прежде чем он сможет манипулировать им? Обратите внимание, что у меня так работает

var tmp = '';
for(var i = 0; i < _options.length; ++i){
    tmp += '<option value="'+_options[i].MaterialName+'">'+_options[i].MaterialCombined+'</option>';
}                                       
var select = new Element('select', {'multiple' : 'multiple', 'size' : ((_options.length > 5) ? 5 : _options.length) , 'class' : 'AF_ddl' , 'style' : 'width:250px'}).update(tmp);

Но мне действительно не нравится этот способ обработки моих элементов! (

1 Ответ

2 голосов
/ 29 апреля 2011

Какое сообщение выдается в исключении?Вы можете попробовать альтернативный метод добавления <option> элементов в коллекцию, поменяв строку

select.options.add(option);

на

select.options[i] = option;

Редактировать: или , вы можете использовать appendChild():

select.appendChild(option);

Рабочая демонстрация: http://jsfiddle.net/Mc8s5/

Обратите внимание, что IE9 в режиме сжатия былвозникли проблемы с самим элементом из-за пробелов после имени тега и имени атрибута в вашем коде.Я удалил их в рабочем примере выше.

...