使用javascript在IE上添加img标签时,onmouseover不起作用

Question

使用javascript在IE上添加img标签时,onmouseover不起作用

Mik*_*e W 4 javascript internet-explorer image onmouseover addeventlistener

我需要一些动态添加img标签的javascript代码到div,而img标签需要onmouseover和onmouseout处理程序.

我有它在Firefox上工作.但它对IE不起作用.在IE上,添加了img标记,但onmouseover和onmouseout处理程序不活动.

这是代码:

<body>  
    <div id='putImageHere' />  

    <script type='text/javascript'>
        var node = document.getElementById('putImageHere');
        var img = document.createElement('img');
        img.setAttribute('src', 'http://sstatic.net/so/img/logo.png');
        node.appendChild(img);

        // first attempt, which works on Firefox but not IE
        img.setAttribute('onmouseover', "alert('mouseover')");
        img.setAttribute('onmouseout', "alert('mouseout')");

        // second attempt, which I thought would work on IE but doesn't
        img.addEventListener('mouseover', function() { alert('mouseover') }, false);
        img.addEventListener('mouseout', function() { alert('mouseout') }, false);
    </script>  
</body>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Ome*_*ari 7

if (img.addEventListener) {
    img.addEventListener('mouseover', function() {}, false);
    img.addEventListener('mouseout', function() {}, false);
} else { // IE
    img.attachEvent('onmouseover', function() {});
    img.attachEvent('onmouseout', function() {});
}

Run Code Online (Sandbox Code Playgroud)

考虑使用许多流行的JavaScript库之一(jquery,prototype等).它们隐藏了浏览器的不一致性,因此您无需担心编写上述代码.

归档时间：	16 年前
查看次数：	15866 次
最近记录：	16 年前