2010-08-13 7 views
1

많은 재사용 가능한 구성 요소가 포함 된 응용 프로그램 (Asp.Net MVC)을 작성하고 있습니다.Ajax 호출에서 돌아 오는 JavaScript 구성을위한 모범 사례

현재 jQuery 라이브러리를 사용하여 이러한 구성 요소를 Ajax 호출로로드하고 있습니다.

이러한 구성 요소는 다른 하위 구성 요소도 호출하므로이 자바 스크립트가 다시 돌아옵니다.

그래서 내가 "콜백"JavaScript를 사용해야합니까?

나는 현재이 같은 있습니다

페이지 :

<html> 
<head> 
    <title>blah</title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" ></script> 
</head> 
<body> 

<div id="Container"></div> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#Container').load('SomeCrazyDomain.com/SomeComponent'); 
    }); 
</script> 
</body> 
</html> 

컴포넌트 :

<p>Load sub components</p><input type="button" onclick="GetSubcompent" /> 
<div id="SubcompentContainer"></div> 

<!-- Is this Bad? --> 
<script type="text/javascript"> 
    function GetSubcompent() { 
     $('#SubcompentContainer').load('SomeCrazyDomain.com/SomeSubComponent'); 
    } 
</script> 

하위 구성 요소 :

<h1>I am a sub compent</h1> 
<script type="text/javascript"> 
    function ToBeLoadedForEachAjaxCall() { 
     //do something 
    } 
</script> 

그대로두면, 각 Ajax 호출에 대해 ToBeLoadedForEachAjaxCall()을로드하면 어떤 영향이 있습니까? broswers가 마지막 ToBeLoadedForEachAjaxCall()을 죽이고 "새로운"것으로 교체합니까?

답변

1

일반적으로 마크 업에 인라인 자바 스크립트를 던져 나쁜 생각, 감사합니다. 유지 보수 및 디버깅이 매우 어려워집니다. 모든 자바 스크립트 코드가 포함 된 일반적인 js 파일을 만들어서 <HEAD> 또는 </BODY> 앞에 포함해야합니다.

$('#SubcompentContainer').load('SomeCrazyDomain.com/SomeSubComponent'); 
function ToBeLoadedForEachAjaxCall() { 
    //do something 
} 

결국,이 코드의 일부는 사이트의 다양한 섹션에 매우 구체적인 것을 깨달을 수 있습니다 예를 들어, 다음을 포함하는 JS 파일이 있습니다. 각 페이지에 SomeCrazyDomain.com/SomeSubComponent을로드하지 않을 수도 있습니다. 이 시점에서 사이트의 다른 섹션에 해당하는 js 파일을 만들도록 선택할 수 있습니다.

두 번째 질문에 답변하십시오. 같은 이름의 자바 스크립트 함수가 여러 개있는 경우 마지막으로 정의 된 함수가 실행됩니다.