2012-09-03 2 views
0

자바 스크립트 작업 초기 단계에서 Google Maps APIv3을 사용하기 위해 asp.net에 작은 애플리케이션을 작성했습니다. 패널에지도를 표시하고 싶습니다. 이것은 내가 쓴 코드입니다하지만 패널의 OnLoad 이벤트와 자바 스크립트를 바인딩에 문제가 :자바 스크립트 함수를 Panel의 OnLoad 이벤트와 바인드 할 수 없습니다.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head runat="server"> 
    <title>Map Test</title> 
    <style type="text/css"> 
     html{height:100%} 
     body{height:100%; margin:0;padding:0} 
     #map_can{height:100%} 
    </style> 
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzawerwerQ55N500rxxxxdPNvMoQ74aRYO30Wo&sensor=true"> 
    </script> 
    <script type="text/javascript"> 
    function init() 
    { 
     var mapoptions= 
      { 
      center: new google.maps.LatLng(17.379064211298, 78.478946685791), 
      zoom:8, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
      }; 
     var map=new google.maps.Map(document.getElementById("map_can"),mapoptions); 
    } 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <asp:Panel OnLoad="init()" ID="Panel1" runat="server" 
     style="z-index: 1; left: 37px; top: 59px; position: absolute; height: 273px; width: 565px"> 
     <div id="map_can" style="width:100%; height:100%"></div> 
    </asp:Panel> 
    </form> 
</body> 
</html> 

오류 : ASP.default_aspx' does not contain a definition for 'init'

나는 내가 길을 잘못 바인딩하고 생각한다. 제발 제안.

답변

1

패널 OnLoad 속성은 서버 쪽로드 이벤트 처리기 (페이지 클래스의 메서드 여야 함)를 설정하는 것입니다.

클라이언트 쪽 DIV 요소를 생성하고 DIV 요소가로드 이벤트를 지원하지 않기 때문에 Panel 컨트롤에서로드 이벤트를 설정할 수 없습니다.

<body onload="init();" > 
    ... 
</body> 

그러나 많은 더 좋은 방법은 함수를 호출하는 DOM 준비 기다려야하는 것입니다

이 중 원시적 인 방법은 BODY 요소의 클라이언트 측로드 이벤트를 사용하는 것입니다.

<script type="text/javascript"> 
    $(document).ready(function() { 
     var mapoptions = { 
      center: new google.maps.LatLng(17.379064211298, 78.478946685791), 
      zoom: 8, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById("map_can"),mapoptions); 
    }); 
</script> 
+0

지금 나는 JQuery와 학습을 생각하고 있지 않다 :이 일을 쉽게 및 크로스 브라우저 방법은 jQuery 같은 라이브러리의 사용이다. 그래서 BODY의 onload 이벤트에 함수를로드하고 div 태그를 패널에 작성하면 작동 할 수 있습니다. 하지만 자바 스크립트 함수가 더 적다면 어떻게 BODY의 onload 이벤트에서 그들을 지정할 수 있습니까? – Cdeez

+0

@Cdeez 당신이 모든 기능을 하나로 결합하거나 다른 모든 기능을 호출하는 하나의 일반 init 기능을 만드는 것을 멈추고있는 것은 무엇입니까? (또한 여기서 전역 이름 공간에 대해 기억하십시오). 적절한 아키텍처 접근법을 제안하려면 페이지 흐름에 대해 더 많이 알아야합니다. – tpeczek

+0

코멘트에 내 질문은 일반적인 기능 중 하나입니다. 비록 내가 나중에 얼마나 나쁘게 앞으로 나아갈 지 계획하지 않았지만 당신의 의견은 나에게 그것을 어떻게 다루는지를 알게 해주었습니다. 내가 문제가 생기면 여기로 돌아 오게. 감사. – Cdeez

관련 문제