2014-10-01 2 views
-1

저는 liflet API를 사용하고 있습니다. 지도에 마커를 만듭니다. 마커를 누르면 팝업 어퍼가 나타납니다. 에는 두 개의 버튼이 있습니다. 내가하려고하는 것은 단추를 눌렀을 때 단추가 색이 바뀌게하는 것입니다. 문제는 팝업이 원래 하나 열릴 때 색상을 재설정하려고하면 팝업은 두 번째 팝업을 열 때만 영향이 발생한다는 것입니다. 팝업 이벤트와 클릭 이벤트 작업을 확인했습니다. 버튼 생성 코드는 : 클릭에html 버튼의 색상이 변경되지 않습니다.

if(!marker.getPopup()){ 
     var tooltipContent = $('<div />'); 
     $.each(marker._myId, function(index,value){ 
      var current = $("<button id=\"router-"+value.properties.name+"\" type=\"button\" style=\"width:100%;color:black\" class='tooltipName' >"+value.properties.name+"</button>") 
       .click(function(){ 
        handleClickOnSwitch(value); 
        var button=$("#router-"+value.properties.name); 
        button.css("background-color","grey"); 

       }); 
      tooltipContent=tooltipContent.append(current); 
     }); 
     marker.bindPopup(tooltipContent[0],{'closeButton' : false,}).openPopup(); 
    } 

나는 회색으로 버튼 coller을 변경합니다. 팝업을 열 때마다 내가 전화 :

function resetButtonPress(marker){ 
    $.each(marker._myId, function(index,router){ 
     var button=$("#router-"+router.properties.name); 
     button.css("background-color","RGB(221,221,221)"); 
    }); 
} 

내가 어떤 도움을 주셔서 감사합니다.

+0

jsfiddle 또는 발생하지 않았습니다. – Frondor

+0

외부 이벤트에 대한 의존성 때문에 여기에 전체 코드를 게시 할 수 없습니다. – raven

+0

jsfiddle.net에 대해 이야기하고 있습니다. 라이브러리를 사용하는 경우 왼쪽 메뉴에 외부 링크를 추가하고 마침내 작업을 저장하고 공유하여 쉽게 작업 할 수 있도록 할 수 있습니다. – Frondor

답변

1

결국 문제의 근본 원인은 경쟁 조건이었습니다. 업데이트하려고하는 버튼 요소가 충분히 빠르게 생성되지 않아 결과적으로 색이 변경되지 않았습니다. 내 솔루션이 열릴 때마다 팝업에서 단추를 만드는 것이 었습니다. 이렇게하면 문제를 피할 수 있습니다.

관련 문제