2016-09-18 138 views
0

我試圖在html文件中定義的按鈕單擊時調用test1.js中定義的直接函數。它總是拋出錯誤「測試未定義」。我有點意識到,作爲一個立即函數,它立即調用,因此它返回「未定義的錯誤」。但有什麼辦法可以通過點擊按鈕來調用直接函數(訪問方法,屬性等)?來自外部函數的Javascript立即函數調用

預先感謝您。

//test1.js 
 

 
var test = (function(){ 
 
alert(window); 
 
var tmp = 'hello'; 
 
}());
<!DOCTYPE html> 
 
<html> 
 
<head> 
 

 
</head> 
 
<body> 
 
<script type="text/javascript" src="test1.js"></script> 
 
    
 
<input type="button" id="btn1" value="ClickMe!" /> 
 
    
 
<script type="text/javascript"> 
 
var btn = document.getElementById("btn1"); 
 
btn.addEventListener("click",fun1,false); 
 

 
function fun1(){ 
 
alert(test.tmp); 
 
} 
 
</script> 
 

 
</body> 
 
</html>

+0

您IIFE沒有返回 – Redu

回答

2

你必須使IIFE返回一個對象與tmp屬性修改代碼。如

var test = (function(){ 
alert(window); 
var tmp = 'hello'; 
return {tmp:tmp}; 
}()); 
0

在運行IIFE後,您需要顯式返回包含要提供的任何數據的對象。 (只需添加返回,就像我對下面的代碼片段所做的那樣)。

//test1.js 
 

 
var test = (function(){ 
 
    alert(window); 
 
    // you need to return any values you want accessible 
 
    return { 
 
    tmp: "hello" 
 
    } 
 
}());
<!DOCTYPE html> 
 
<html> 
 
<head> 
 

 
</head> 
 
<body> 
 
<script type="text/javascript" src="test1.js"></script> 
 
    
 
<input type="button" id="btn1" value="ClickMe!" /> 
 
    
 
<script type="text/javascript"> 
 
var btn = document.getElementById("btn1"); 
 
btn.addEventListener("click",fun1,false); 
 

 
function fun1(){ 
 
alert(test.tmp); 
 
} 
 
</script> 
 

 
</body> 
 
</html>