输入正确的参数时出现问题

我在将eventListener的正确参数放入函数中时遇到了问题。输入正确的参数时出现问题

<!DOCTYPE html> 
    <html> 
    <head> 
    <title></title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <script type="text/javascript">   

      window.onload = function() { 
      var galleryContainer = document.getElementById('galleryContainer'); 
      var image = galleryContainer.getElementsByTagName('div'); 
      //console.log(image); 

      var images = new Array(); 
      images.push(image); 

      for(var i = 0; i < images[0].length; i++) { 
       images[0][i].addEventListener('click', function() {showImage(this) 
       }, false); 
       }; 
      } 
    // I dont know with parameter to put into showImage() from the listener. 
      function showImage(here is the problem) { 

      var preview = document.getElementById('preview'); 
      preview.innerhtml = image.innerhtml; 
    // I want to put the image into the preview element. 

      } 
    </script> 
</head> 
<body> 
    <div id="galleryContainer"> 
     <div>trams</div> 
     <div>trams</div> 
     <div>trams</div> 
     <div>trams</div> 
    </div> 
    <div id="preview" style="width: 200px; height: 200px; border: 1px solid red"></div> 
</body>

来源

2011-09-22 Oscar

什么是你的问题？ – nfechner

可怜，但它有他的代码:) – Saket

我不知道如何从eventListener的图像元素到函数showImage。 – Oscar

试试这个代码：

<!DOCTYPE html> 
    <html> 
    <head> 
    <title></title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <script type="text/javascript">   

      window.onload = function() { 
      var galleryContainer = document.getElementById('galleryContainer'); 
      var images = galleryContainer.getElementsByTagName('div'); 
      //console.log(images); 

      for(var i = 0; i < images.length; i++) { 
       images[i].addEventListener('click', showImage, false); 
      }; 
      } 
// I dont know with parameter to put into showImage() from the listener. 
      function showImage(ev) { 
      ev=ev||event; // ev now point to click event object 
      var preview = document.getElementById('preview'); 
      preview.innerHTML = this.innerHTML; // this point to DIV(trams) 
      } 
    </script> 
</head> 
<body> 
    <div id="galleryContainer"> 
     <div>trams1</div> 
     <div>trams2</div> 
     <div>trams3</div> 
     <div>trams4</div> 
    </div> 
    <div id="preview" style="width: 200px; height: 200px; border: 1px solid red"></div> 
</body>

工作实例http://jsfiddle.net/Cp6HJ/

来源

2011-09-22 11:22:05

没有什么叫'innerhtml'，我不认为他的代码应该需要这么多的改变。 – Saket

@Saket我改变了'innerhtml'到'innerHTML' –

这很好。非常感谢你。你能解释一下ev = ev ||事件吗？呢？ – Oscar

-1

使用此函数定义语句：

function showImage(image) { 
    ... 
}

和纠正在内部HTML语句：（注意大写的 'H'）

preview.innerHTML = image.innerHTML;

来源

2011-09-22 11:21:17 Saket

你的意思是'.innerHTML' – Raynos

@Saket：在评论我的答案之前，你必须检查你的答案！ –

window.onload = function() { 
     var galleryContainer = document.getElementById('galleryContainer'); 
     var image = galleryContainer.getElementsByTagName('div'); 
     //console.log(image); 

     var images = new Array(); 
     images.push(image); 

     for(var i = 0; i < images[0].length; i++) { 
      var callback = function(item){ return function(){ showImage(item); }; }(images[0][i]); 
      images[0][i].addEventListener('click', callback, false); 
     }; 
     }; 

     function showImage(item) { 
     var preview = document.getElementById('preview'); 
     preview.innerHTML = item.innerHTML; 
     }

来源

2011-09-22 11:48:59 deej

这也工作得很好，谢谢：D。 – Oscar

输入正确的参数时出现问题

回答

相关问题