JavaScript 래퍼 함수 - 내부 함수가 호출되지 않았습니다.

외부 함수에서 javascript 파일의 모든 코드를 래핑 한 후에 내부 함수를 호출하려고하지만 내부 함수가 호출되지 않습니다.JavaScript 래퍼 함수 - 내부 함수가 호출되지 않았습니다.

(function(){ 

function calculateArea(){ 

    var a=parseInt(document.getElementById("sideA").value); 
    var b=parseInt(document.getElementById("sideB").value); 
    var c=parseInt(document.getElementById("sideC").value); 

    debugger; 

    var perBy2= (a+b+c)/2; 

    var squareArea= perBy2 * (perBy2-a)*(perBy2-b)*(perBy2-c); 

    var areaOf=Math.sqrt(squareArea); 

    document.getElementById("area").innerHTML=areaOf; 


} 
})();

아래는 내 html 파일 조각입니다 :

다음은 내 자바 스크립트입니다.

<!DOCTYPE html > 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>Insert title here</title> 
</head> 
<body> 
    <form action=""> 
    Side A : <input type="text" id=sideA placeholder="Side A" required /><br> 
    Side B :<input type="text" id=sideB placeholder="Side B" required /><br> 
    Side C :<input type="text" id=sideC placeholder="Side B" required /><br> 
    <button onClick="calculateArea()">Calculate the Area</button> 
    </form> 

    AREA IS:<div id="area"></div> 
<script type="text/javascript" src="js/area.js"></script> 
</body> 
</html>

내가 처리 인라인 이벤트를 제거하고 내 인생의 제안에 따라 같은 이벤트의 청취자를 추가 한 후 안녕 모든 문제가 해결. 그러나 값이 안정되고 원하지 않는 GET 호출이 일어나기 때문에 결과를 볼 수 없습니다. 당신이 당신의 <button>에 가지고있는 것처럼

Remote Address:127.0.0.1:9999 
Request URL:http://localhost:9999/JavaScriptQuestion/? 
Request Method:GET 
Status Code:200 OK 
Request Headersview source 
Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8 
Accept-Encoding:gzip,deflate,sdch 
Accept-Language:en-US,en;q=0.8 
Connection:keep-alive 
Cookie:JSESSIONID=5CC7F1D56201D4DEB07FB6C56FF89125 
Host:localhost:9999 
Referer:http://localhost:9999/JavaScriptQuestion/? 
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/35.0.1916.153 Safari/537.36 
Response Headersview source 
Content-Length:571 
Content-Type:text/html;charset=ISO-8859-1 
Date:Wed, 02 Jul 2014 05:20:20 GMT 
Server:Apache-Coyote/1.1

출처

2014-07-01 user3440629

당신의 함수는 전역 변수가 아닌'immediate' 함수의 범위에 묶여 있습니다. 빠르고 쉬운 수정은'window.calculateArea = function'를 사용하여 전역 범위에 직접 콜백을 할당하는 것입니다. 여기에 바이올린이 있습니다 : http://jsfiddle.net/HFUvC/ – Jack

거기에'debugger' 라인은 무엇입니까? – Cerbrus

날씨를보기 위해 코드를 추가했기 때문에 코드 실행이 함수 내부로 들어가는 지 알 수 없습니다. – user3440629

귀하의 내부 함수는 인라인 클릭 핸들러에 의해 IIFE에 싸여, 그래서 전역에없는 때문에 호출 할 수 없습니다입니다.

전역 범위로 함수를 이동하거나 인라인 HTML 대신 JavaScript 자체에서 클릭 핸들러를 할당하십시오.

(function(){ 
    function calculateArea(){ 
     var a=parseInt(document.getElementById("sideA").value); 
     var b=parseInt(document.getElementById("sideB").value); 
     var c=parseInt(document.getElementById("sideC").value); 

     debugger; 

     var perBy2= (a+b+c)/2; 
     var squareArea= perBy2 * (perBy2-a)*(perBy2-b)*(perBy2-c); 
     var areaOf=Math.sqrt(squareArea); 

     document.getElementById("area").innerHTML=areaOf; 
    } 

    window.onload = function(){ 
     // give the button an ID, or use some other way to grab it 
     document.getElementById("someid").onclick = calculateArea; 
    }; 
})();

출처

2014-07-01 07:02:31 MrCode

감사합니다. 어떻게하면 "인라인 HTML 대신 JavaScript 자체에서 클릭 핸들러를 할당 할 수 있습니까?" – user3440629

@ user3440629'window.onload'와'element.onclick'을 사용하여 답을 보자. – MrCode

오우 감사합니다. 그래서이 인라인 클릭 단추에서 처리기를 제거하고 window.onload에 클릭 처리기를 적용해야합니다. – user3440629

귀하의 문제는 인라인 이벤트 핸들러, 예를 들어,의 (AB) 사용하는 것입니다 : 당신은 단지 메서드를 호출 할 수 있습니다 인라인 이벤트 핸들러와

onClick="calculateArea()"

(사용되지 않는 및 사용할 수 없습니다) 그 글로벌 범위에 있습니다. IIFE 랩퍼를 사용하면 해당 범위에서 의도 한 기능을 숨길 수 있습니다. mybutton 실제로 시간이 존재하는지 확인하기 위해 DOM이로드되고 스크립트가 실행되는 순서에

document.getElementById('mybutton').addEventListener('click', calculateArea, false);

에주의 :

당신의 버튼에 ID를 추가하고 인생 안에이 추가 라인이 실행됩니다.

출처

2014-07-01 07:03:48 Alnitak

감사합니다조차이 잘 일했다. – user3440629

JavaScript 래퍼 함수 - 내부 함수가 호출되지 않았습니다.

답변

관련 문제