Question

所以，我的代码没有包装，但是没有工作onLoad。有人可以向我解释为什么这不起作用吗？我试图让这个为我的网络应用程序工作，但JavaScript不起作用。但是，当我将它插入小提琴时，它会在我从onLoad更改为无包装时起作用。

＆＃13;

function zoomIn(event) {
  var element = document.getElementById("overlay0");
  element.className = "overlay";
  element.style.display = "inline-block";
  var img = document.getElementById("imgZoom0");
  var posX = event.offsetX ? (event.offsetX) : event.pageX - img.offsetLeft;
  var posY = event.offsetY ? (event.offsetY) : event.pageY - img.offsetTop;
  element.style.backgroundPosition=(-posX*2)+"px "+(-posY*4)+"px";

}

function zoomOut() {
  var element = document.getElementById("overlay0");
  element.style.display = "none";
}

＆＃13;

.overlay{
  border:1px solid black;
  width:350px;
  height:200px;
  display:none;
  background-image:url('http://ginger-mum.com/wp-content/uploads/2015/10/3633-1269758855-0da5042c33400a811a5d766be4579cb8.jpg');
  background-repeat:no-repeat;
  
}

＆＃13;

<img id="imgZoom0" onmousemove="zoomIn(event)" onmouseout="zoomOut()" src="https://apparelpop.s3-us-west-1.amazonaws.com/images/DEA411-AT.jpg" alt="Dea411 at" width="150" height="150" />
<div id=overlay0 onmousemove="zoomIn(event)"></div>

＆＃13;

Answer 1

因为当你使用onLoad选项时，代码被包装在一个加载事件处理程序中......如：

window.onload = function(){
  // your code  ends up here    
}

因此，您的函数范围不在全局窗口空间中，他们需要能够从dom调用它们

JavaScript没有包装，但没有使用jsfiddle onLoad

1 个答案: