Openlayers에서 html 텍스트 상자에 좌표 값을 바인딩

Question

그래서지도를 클릭 할 때 코드를 작성하고 있습니다. 그것은 좌표 값을 검색하고 그것을 바인딩하려고합니다 (그 값을 보여줌). 내가 그것을 테스트 한 좌표 및 클릭 이벤트가 작동하지만 텍스트 상자에 바인딩하는 데 문제가있는 것 같아요. 이 문제를 해결하는 방법에 대한 제안?

코드 :

<script type="text/javascript" src="http://www.openlayers.org/api/OpenLayers.js"></script> 
    <script type="text/javascript"> 
     OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, { 
        defaultHandlerOptions: { 
         'single': true, 
         'double': false, 
         'pixelTolerance': 0, 
         'stopSingle': false, 
         'stopDouble': false 
        }, 

        initialize: function (options) { 
         this.handlerOptions = OpenLayers.Util.extend(
           {}, this.defaultHandlerOptions 
          ); 
         OpenLayers.Control.prototype.initialize.apply(
           this, arguments 
          ); 
         this.handler = new OpenLayers.Handler.Click(
           this, { 
            'click': this.trigger 
           }, this.handlerOptions 
          ); 
        }, 

        trigger: function (e) { 
         var lonlat = map.getLonLatFromPixel(e.xy); 

         alert("You clicked near " + lonlat.lat + " N, " + 
                 +lonlat.lon + " E"); 
         $('#latlon').value = lonlat; 
        } 
       }); 
    </script> 

는 내가 텍스트 상자를 정의하는 방법 :

는

<input type="text" name="coordinates" id="latlon" value="" Font-Names="Tahoma" Font-Size="10pt" Width="95%" /> 

오류 메시지 : 이는

Uncaught TypeError: Cannot set property 'value' of null 
OpenLayers.Control.Click.OpenLayers.Class.trigger 

Answer 1

당신은 $('#latlon')의 value 속성을 사용하지 않습니다 한정된.

$('#latlon').val(lonlat);을 jQuery에서와 같이 사용하십시오.

value과 val()의 차이점에 대한 자세한 내용은 스택 오버 플로우 문제를 참조하십시오.

jquery function val() is not equivalent to "$(this).value="?

,이 코드에 jQuery를 포함됩니다 Openlayers.js 파일을 포함하기 전에 다음 줄을 추가

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>