Question

在一个学校项目的网站上工作并尝试合并一些JavaScript。

我有一个包含四个功能的列表，每个功能用于不同的页面。它们只是具有不同参数的相同功能，因为它是一个照片库，每个页面都有不同的照片。但是，我只能使JS文件中的最后一个工作，并且列出的前三个不可点击。这是我的代码：

HTML：

window.onload = gallery;
function gallery(){
 var allimages = document.images;
 for(var i=0; i<allimages.length; i++){
      if(allimages[i].id.indexOf("Faith") > -1){
           allimages[i].onclick = imgChanger;
      }
 }
}
function imgChanger(){
 document.getElementByid('.myPicture').src ="Images/"+this.id+".jpg";
}

window.onload = gallery;
function gallery(){
 var allimages = document.images;
 for(var i=0; i<allimages.length; i++){
      if(allimages[i].id.indexOf("Ian") > -1){
           allimages[i].onclick = imgChanger;
      }
 }
}

function imgChanger(){
 document.getElementById('myPicture').src ="Images/"+this.id+".jpg";
}

window.onload = gallery;
function gallery(){
 var allimages = document.images;
 for(var i=0; i<allimages.length; i++){
      if(allimages[i].id.indexOf("Dan") > -1){
           allimages[i].onclick = imgChanger;
      }
 }
}
function imgChanger(){
 document.getElementsId('myPicture').src ="Images/"+this.id+".jpg";
}

window.onload = gallery;
function gallery(){
 var allimages = document.images;
 for(var i=0; i<allimages.length; i++){
      if(allimages[i].id.indexOf("Sum") > -1){
           allimages[i].onclick = imgChanger;
      }
 }
}

function imgChanger(){
 document.getElementById('myPicture').src ="Images/"+this.id+".jpg";
}

的java：

AUTH_USER_MODEL = your custom user class

Answer 1

如果所有脚本都在同一个文件或范围内，那么每次声明它们时都会覆盖这些函数。要么将其名称更改为唯一的名称，要么使用参数来修改该函数。

function gallery( name ){
 var allimages = document.images;
 for(var i=0; i<allimages.length; i++){
        // check the name is in the image id property
      if(allimages[i].id.indexOf( name ) > -1){
            // I change this to addEventListener
           allimages[i].addEventListener('click', imgChanger, false);
      }
 }
}

// you should anly need one image changer for the main window.
function imgChanger(e){
    // in here e is injected into the function. it contains your event data
    // e.target is used to get the element that fired the event
    // document.getElementById('myPicture').src ="Images/"+this.id+".jpg";
    // below is more concise
    document.getElementById('myPicture').src = this.src;
}

gallery('Dan'); // pass in the name
gallery('Ian'); // pass in the name

JS函数在多个页面上

1 个答案: