.onclick事件監聽器通過div在頁面加載後立即運行

這可能是一個nooby問題，但這個腳本正在殺死我：該腳本假設在鼠標單擊時用事件監聽器更改div權重。函數changeWidth（i）工作得很好。問題是事件監聽器在加載頁面時自動觸發，然後停止工作。沒有控制檯錯誤。.onclick事件監聽器通過div在頁面加載後立即運行

var tile1 = document.getElementById("project_tile_01"); 
var tile2 = document.getElementById("project_tile_02"); 
var tile3 = document.getElementById("project_tile_03"); 

tile1.onclick = changeWidth(1); 
tile2.onclick = changeWidth(2); 
tile3.onclick = changeWidth(3); 

function changeWidth(i){ 
    if(i==1){ 
     tile1.style.width=(200+"px"); 
     tile2.style.width=(150+"px"); 
     tile3.style.width=(150+"px"); 
     tile4.style.width=(150+"px"); 
     tile5.style.width=(150+"px"); 
     tile6.style.width=(150+"px"); 
    }else if(i==2){ 
     tile1.style.width=(150+"px"); 
     tile2.style.width=(200+"px"); 
     tile3.style.width=(150+"px"); 
     tile4.style.width=(150+"px"); 
     tile5.style.width=(150+"px"); 
     tile6.style.width=(150+"px"); 
    }else if(i==3){ 
     tile1.style.width=(150+"px"); 
     tile2.style.width=(150+"px"); 
     tile3.style.width=(200+"px"); 
     tile4.style.width=(150+"px"); 
     tile5.style.width=(150+"px"); 
     tile6.style.width=(150+"px"); 
}

我不確定這是否是加載順序的問題，腳本與< SCRIPT>在頁面的結束標記運行這是一個真正的最小頁面。提前致謝。

來源

2014-02-28 Omar Gonzalez

tile1.onclick = changeWidth(1);

您立即調用與()的功能，這是undefined被分配到tile1.onclick功能的結果。

這裏是你可以做什麼，而不是：

tile1.onclick = changeWidth.bind(null, 1);

來源

2014-02-28 19:41:15 plalx

明白了，理智和完美。非常感謝！ –

你需要用你的changeWidth呼叫的功能。

tile1.onclick = function(){changeWidth(1);}

來源

2014-02-28 19:50:33

這個tile1.onclick = changeWidth(1);將會在body被加載時被調用，如plalx所說。你也可以做這樣的事情。

只有在單擊該元素時纔會觸發。

tile1.onclick = function(){ 
    changeWidth(1); 
}; 

tile2.onclick = function(){ 
    changeWidth(2); 
}; 

tile3.onclick = function(){ 
    changeWidth(3); 
};

來源

2014-02-28 19:50:39

.onclick事件監聽器通過div在頁面加載後立即運行

回答

相關問題