Как установить событие onmousedown для динамически созданного div в IE?

У меня есть инструмент (javascript), который динамически создает div всякий раз, когда пользователь нажимает на экран.

_newDiv = document.createElement('div');

Теперь, после того как я создал _newDiv, я хочу назначить ему событие onmousedown.

_newDiv.onmousedown = function(event) { onNewDivMouseDown(event); };

Это отлично работает в Firefox, но не работает в IE 8. Есть ли какой-нибудь хак, который я могу использовать для решения этой проблемы?

Спасибо!


javascript internet-explorer onmousedown javascript-events
person JonathanReez    schedule 10.09.2011    source источник

Ответы (2)


arrow_upward
2
arrow_downward

Проблема решена!

Оказывается, из-за того, что динамически созданный div был сделан прозрачным с помощью progid:DXImageTransform, IE не зафиксировал событие onmousedown для указанного div. Проблема решилась вставкой

background-image:url(/none)

в таблице стилей div. По какой-то причине он работает, даже если вставлено несуществующее изображение, поэтому я использовал его.

person JonathanReez    schedule 11.09.2011

arrow_upward
0
arrow_downward

До IE9 объект event не передавался обработчику. Вместо этого это глобальная переменная. Таким образом, традиционная идиома:

function handler(event) {
  event = event || window.event;
  // ...
}

Итак, в вашем случае:

_newDiv.onmousedown = function(event) {
    onNewDivMouseDown(event || window.event);
};
person Pointy    schedule 10.09.2011
comment
Проблема в том, что даже функция onNewDivMouseDown не вызывается. Я попытался поставить alert('!') вместо onNewDivMouseDown, и он все еще не работает. Я установил if (!event) {event = window.event;} ранее в коде. - person JonathanReez; 10.09.2011
comment
*позже в коде (внутри функции onNewDivMouseDown), а не раньше :) - person JonathanReez; 10.09.2011
comment
Возможно, я мог бы помочь, если бы увидел, что вы делаете с _newDiv - как вы добавляете его в DOM? Как выглядит остальная часть страницы? Можете ли вы воспроизвести проблему с помощью простого jsfiddle? - person Pointy; 10.09.2011
comment
_newDiv = document.createElement('div'); _newDiv.className = 'square' _newDiv.style.borderColor = #FF0000; _newDiv.style.left = '10 px'; _newDiv.style.top = '50 px'; _newContainer = document.getElementById('newContainer'); _newContainer.appendChild(_newDiv);... _newDiv.onmousedown = function(event) { onNewDivMouseDown(event); }; Надеюсь, что это прояснит проблему. Он отлично работает в Firefox, поэтому я предполагаю, что это какая-то особенность IE. - person JonathanReez; 10.09.2011
comment
Элемент вообще отображается на странице с IE? Одна вещь, которая может быть проблемой, заключается в том, что в измерениях пикселей CSS не должно быть пробела между числовым значением и суффиксом единицы измерения; Итак, 10 пикселей, а не 10 пикселей. Видите ли вы какие-либо ошибки в консоли разработчика IE8? - person Pointy; 10.09.2011
comment
Да, это проявляется. Просто я не могу назначить ему какие-либо события. CSS в порядке, я вставил «10 пикселей» в качестве примера. Ошибок в консоли нет... - person JonathanReez; 10.09.2011
comment
Хорошо, я сузил ошибку до события onmousedown. onmouseup и onmousemove работают отлично, но по какой-то причине onmousedown невозможно установить в IE. Очень странно... - person JonathanReez; 11.09.2011
comment
Проблема решена (см. ниже)! Оказывается, проблема была вызвана фильтром progid:DXImageTransform, который я использовал, чтобы сделать фон div прозрачным. - person JonathanReez; 11.09.2011