자바 스크립트를 사용하여 하위 요소를 제거하십시오.

jQuery 플롯을 생성하기위한 데이터를 제공하는 AJAX 호출이 있습니다. 이 AJAX 호출이 실행될 때마다 새로운 JSON 데이터가 돌아오고 플롯이 자동으로 업데이트됩니다.자바 스크립트를 사용하여 하위 요소를 제거하십시오.

JSON 데이터를 플롯하는 것 외에도 ConvertOrSave.appendChild(btn);을 사용하여 하위 요소로 추가되는 버튼을 만드는 코드가 있습니다. 이 코드의 유일한 문제점은 AJAX 호출이있을 때마다 새로운 btn이 추가된다는 것입니다. 버튼 하나만 있으면됩니다.

새 버튼을 추가하기 전에 이전 버튼이 제거되었는지 확인하는 가장 좋은 방법은 무엇입니까? 감사.

$("#flotAverageSalePricesCity").result(function(event, data, formatted) { 
if (data){ 
    $.ajax({ 
     url: sURL + "utility/ajaxmuniChart1c", 
     type: "POST", 
     data: {muni: data[0]}, 
     dataType: 'json',    
     success: function(json){ 
      if (data) {      
       myWidth = (document.getElementById('flot_widget').offsetWidth-45)+"px"; 
       myHeight = (document.getElementById('flot_widget').offsetWidth*.66)+"px"; 
       document.getElementById('wrapper').style.display = 'block';     
       document.getElementById('printflotcontainer').style.display = 'block'; 
       document.getElementById('flotcontainer').style.width = myWidth; 
       document.getElementById('flotcontainer').style.height = myHeight; 
       var options = { 
        series: { 
         lines: { show: true, fill: false, fillColor: "rgba(255, 255, 255, 0.8)" }, 
         points: { show: true, fill: true } 
        }      
       }; 

       $.plot("#flotcontainer", [json], options); 
       myCanvas = $('#flotcontainer').find('canvas.base');  
       flotcontainercanvas = myCanvas.get(0); 
       ctx3 = flotcontainercanvas.getContext('2d'); 
       myLocation = sURL + 'php/saveme.php'; 
       var cs = new CanvasSaver(myLocation) 
       var btn = cs.generateButton('Save', flotcontainercanvas, 'PTS_Chart');     
       ConvertOrSave.appendChild(btn); 
      } 
     } 
    }) 
} 
})

편집 : convertAndSave가 만에 하나 개 다른 요소를 가지고 있기 때문에

<div id="ConvertOrSave" class="g2"> 
     <button id="convert">convert</button> 
</div>

출처

2013-10-10 DanielAttard

'btn'의 클래스 이름은 무엇입니까? –

success 콜백에서 버튼 추가를 제거하고 다른 위치에 넣을 수 있습니까 (onload와 같은)? –

@JayHarris'btn'에 대한 클래스 이름이 없습니다. 여기에 표시된 코드로만 생성됩니다. – DanielAttard

, 당신은 단지 변환 추가하고 의해 중복을 추가 피할 수 있습니다 : 여기 ConvertOrSave의 유일한 요소가 여기에 코드입니다 새로운 버튼 (즉 취하면 의미)

var convert = document.getElementById('convert'); 
ConvertOrSave.innerHTML = convert + btn;

출처

2013-10-10 04:44:59

당신은 함께 새로운 하나를 추가하기 전에 기존의 버튼을 삭제할 수 있습니다

var btn = document.getElementById('convert'); 
btn && btn.parentNode.removeChild(btn);

515,는 여기를 참조하십시오 http://jsfiddle.net/F3Uxa/

출처

2013-10-10 04:49:19

죄송합니다 @wilmoore,하지만이 코드는 나를 위해 작동하지 않았다. – DanielAttard

당신은 기존의 버튼을 제거 할 수 있습니다

var btn = document.getElementById('convert'); 
if (btn != null){ 
    btn.remove(); 
}

확인이 Fiddle이 기존의 버튼을 제거합니다. 도움이되기를 바랍니다.

출처

2013-10-10 04:53:49 super

자바 스크립트를 사용하여 하위 요소를 제거하십시오.

답변

관련 문제