Javascript 中与事件处理程序关联的嵌套匿名函数是否不起作用？

Question

如果我改用命名函数，效果会很好:

<script type="text/javascript">
   window.onload = function(){
       var img = document.getElementById('im');
        img.onload = fun();

   } 
function fun()
{
  alert("Image loaded");
}          
</script>

<img src="picture.png" id="im"/>

但是，我的问题是，当我尝试使用 匿名函数（如下所示）时，为什么不行吗？

<script type="text/javascript">   
       window.onload = function(){
       var img = document.getElementById('im');
          img.onload = function(){

          alert("Image loaded");
        }
       }            
</script>

<img src="picture.png" id="im"/>

Answer 1

在您的第一个示例中，当事件处理程序附加到图像时（图像加载后）调用 fun。

在您的第二个示例中，匿名函数在图像加载后附加到图像。

要查看您想要的行为，请尝试：

<script type="text/javascript">
  window.onload = function(){
    var img = document.getElementById('im');
    img.onload = fun;

    img.src = "picture.png";
  } 

  function fun()
  { 
    alert("Image loaded");
  }          
</script>

<img id="im"/>

或

<script type="text/javascript">   
   window.onload = function() {
     var img = document.getElementById('im');
     img.onload = function(){
       alert("Image loaded");
     }

     img.src="picture.png" 
   }            
</script>

<img id="im"/>

或

<script type="text/javascript">
  function fun()
  { 
    alert("Image loaded");
  }          
</script>

<img id="im" src="picture.png" onload="javascript:fun();"/>

Javascript 中与事件处理程序关联的嵌套匿名函数是否不起作用？

Does a nested anonymous function in Javascript associated with an event handler not work?

javascript

anonymous-function