Javascript - 여러 함수 호출/이벤트 결합

Question

다음은 div.holder를 사용하여 웹 브라우저의 뷰포트와 일치하도록 크기를 조정하는 fullScreen() 함수의 예입니다.

function fullScreen() 
{ 
    // Call to doSize() to resize the .holder when fullscreen() is first called 
    doSize(); 

    // Call to doSize() on a window resize event 
    $(window).resize(function(e) { 
     doSize(); 
    }); 

    // doSize() - sets .holder to window viewport size 
    function doSize() 
    { 
     $('.holder').width(bInfo.winWidth()).height(bInfo.winHeight()); 
    }; 
}; 

나는 잠시 지금이 같은 짓을했지만, 나는 항상 전체 화면() 함수의 내부 회) doSize을 (호출 이상한보고 생각했습니다. 처음으로 fullscreen()이 처음 호출 될 때 .holder 크기 조정 작업을 시작한 다음 window.resize 이벤트에서 그 후에 .holder를 업데이트하려고합니다.

doSize()와 같은 함수를 함수의 맨 위에서 선언 한 다음 다시 window.resize 이벤트로 선언하지 않아도 더 우아하게 시작할 수있는 방법이 있습니까? 아니면 이것과 같은 것을하는 유일한 방법입니까? 그것은 나에게 미숙 한 것처럼 보입니다. 그래서 누군가가 개선 할 수 있는지를 알게 될 것이라고 생각했습니다.

이 화장품 변화보다는 조금 더 많은 금액

Answer 1

,하지만 당신을 위해 무엇을 찾고있는 것처럼 소리 : 내가 많은 비용이 정상 해제를 돌아보다 다른이를 구현하는 표시되지 않습니다

function fullScreen() 
{ 
    // Call to doSize() to resize the .holder when fullscreen() is first called 
    // doSize(); // moved into assignment below 

    // Call to doSize() on a window resize event 
    $(window).resize(doSize()); 

    // doSize() - sets .holder to window viewport size 
    function doSize(){ 
     $('.holder').width(bInfo.winWidth()).height(bInfo.winHeight()); 
     return doSize; // allows executions to assign 
    }; 
}; 

아무것도 대신에 필요로하는 기능이지만, 그렇게 많은 시간을 소비해서는 안됩니다. 대신에 on()을 사용하도록 .resize()를 수정하고 on (doSize())를 호출하여 doSize()를 호출하여 fullScreen()을 두 번 이상 호출하면 여분의 크기 조정 이벤트가 누적되지 않도록 할 수 있습니다.

Answer 2

function fullScreen() { 
    var doSize = function() { 
     $('.holder').width(bInfo.winWidth()).height(bInfo.winHeight()); 
    }; 

    // call it once 
    doSize(); 

    // delegate to resize event 
    $(window).resize(doSize); 
}; 

대신 두 번 함수를 호출, 당신은 단지 $(window).resize()에 직접 doSize에 대한 참조를 전달합니다. 귀하의 경우 다른 중개 기능을 만들 필요가 없습니다.

Answer 3

fullScreen()으로 포장하지 않는다면 어떻게 될까요? 당신이 버튼을 클릭 할 때 호출 할 수 있도록 fullScreen()이 있다고 가정하고 브라우저의 크기를 조절할 때 doSize()를 사용합니다 ...

방금 ​​doSize()를 정의하고 전역 변수를 정의하면 fullScreen을 호출하고 doSize()를 $(window).resize()에 전달하면됩니다. 그런 다음 버튼을 클릭하면 fullScreen = 1을 설정하고 doSize()를 호출합니다.

$(window).resize(function(e) { 
    doSize(); 
});  
function doSize() 
{ 
    if(fullScreen===1){ 
     $('.holder').width(bInfo.winWidth()).height(bInfo.winHeight()); 
    } 
    else{ 
     // return the div to default size 
    } 
}; 

그들은 처음에 (버튼에서 임 가정 클릭) 화면이 자동으로 크기가 조정되고 동안에 만 fullScreen=1이 사업부는 fulscreened 및 크기가 조정됩니다 전체 화면 입력이 방법 : 당신이로) doSize을 (정의 할 때 달콤한 부분은 .

그냥 .02. 희망 ...

Answer 4

doSize 함수 자체에 대한 참조를 처리기로 전달해야합니다. 호출을 래핑하는 익명의 함수가 아닙니다.

당신이 초기화를 위해 호출 할 수 doSize를 선언하지 않으려면, 당신은 단지 resize 이벤트를 트리거 할 수 있습니다 : 그것은이 요구되기 때문에

function fullScreen() { 
    // Call to doSize() on a window resize event 
    $(window).resize(function doSize(e) { 
     // sets .holder to window viewport size 
     $('.holder').width(bInfo.winWidth()).height(bInfo.winHeight()); 
    }).resize(); // trigger for initialisation 
}