전단지 오버레이 레이어에 클릭 이벤트를 첨부하는 데 문제가 있습니다. 내 HTML의 <form>
은 <button>
이며 클릭하면 큰지도 (외부 웹 사이트)에 연결됩니다. 나는 몇 가지 기본 레이어를 가지고 있기 때문에, 내가 링크는 층이 층에 클릭 해당 사이트를 가리 키도록 action
속성을 변경하려면 제어 :전단지에서 기본 레이어를 클릭하면 양식의 동작 속성을 동적으로 변경하는 방법은 무엇입니까?
<div id='map'></div>
<form id='viewlarger'
action='https://www.openstreetmap.org/#map=15/14.5906/120.9799'
method='get'
target='_blank'>
<button>View larger map</button>
</form>
자바 스크립트에게 :
var map = L.map('map', {
center: [14.5906, 120.9799],
zoom: 15,
layers: [stamenTerr]
});
var base = {
"Stamen Terrain": stamenTerr,
"Stamen Toner": stamenToner,
};
L.control.layers(base).addTo(map);
var largerButton = document.getElementById('viewlarger');
var stamenTerr = L.tileLayer('http://stamen-tiles-{s}.a.ssl.fastly.net/terrain/{z}/{x}/{y}.png', {
attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> — Map data © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
subdomains: 'abcd'
});
var stamenToner = L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/toner/{z}/{x}/{y}.{ext}', {
attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> — Map data © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
subdomains: 'abcd',
ext: 'png'
});
I을 addEventListener
를 사용하여 시도하지만, 레이어 컨트롤에서 다른베이스 레이어를 클릭 할 때 나는 제대로 링크를 변경할 수 없습니다
stamenTerr.addEventListener('click', function() {
largerButton.action = "http://maps.stamen.com/terrain/#15/14.5906/120.9799";
});
stamenToner.addEventListener('click', function() {
largerButton.action = "http://maps.stamen.com/toner/#15/14.5906/120.9799";
});
을 이 문제를 해결하는 방법을 확인해 주시겠습니까? 고맙습니다.
편집 :
내가 이것을 시도했지만 링크가 변경되지 않습니다
:map.on('click', function() {
if (map.hasLayer(tileStamenToner)) {
viewLMapBtn.action = http://maps.stamen.com/toner/#15/14.5906/120.9799";
};
});
나는 당신이 제공 한 코드를 사용하는 방법을 이해하는 데 어려움을 겪고 죄송합니다. 나는 그 질문을 편집했다. 확인해주십시오. – JAT86