모든 문자열 요소를 단일 문자열로 캡쳐

Question

다음 자바 스크립트 함수를 사용하여 양식의 각 요소에 입력 된 값을 캡처했습니다. 사용자가 제출 버튼을 클릭하면 각 컨트롤에 대해 사용자가 입력 한 값이 표시되어야합니다. 코드는 라디오 버튼을 제외한 모든 컨트롤에서 잘 작동합니다. 누구든지 나에게 그 방법을 제안 할 수 있습니까?

function DisplayFormValues(){ 
      var str = ''; 
      var elem = document.getElementById('form1').elements; 
      for(var i = 0; i < elem.length; i++) 
      { 

       str += "<b>Name:</b>" + elem[i].name + "\n"; 
       str += "<b>Value:</b><i>" + elem[i].value + "\n"; 
       str += "<BR>"; 
      } 
      document.getElementById('lblValues').innerHTML = str; 
     } 

Answer 1

라디오 버튼과 체크 박스의 값은 DOM에서 동일한 이름을 공유하기 때문에 가져 오기가 쉽지 않습니다. 당신은이 요소들 각각을 순환 시켜서 그 자식들 중 어떤 것이 검사되는지 검사해야합니다.

그래서 루프를 확장해야합니다. 이를 수행하는 한 가지 방법은 다음과 같습니다.

function DisplayFormValues(){ 
    var theform = document.form1; 
    var a = ['input', 'textarea', 'select']; 
    var echo = ''; 
    for (var i = 0; i < a.length; i++) { 
     var tag = a[i]; 
     var els = theform.getElementsByTagName(tag); 
     for (var j = 0; j<els.length; j++) { 
      el = els[j]; // the element 
      if ((tag == 'input' && (el.type == 'text' || el.type == 'password')) || tag == 'select') { 
       echo += '<strong>' + el.name + '</strong>: ' + el.value + '<br />'; 
      } else if ((tag == 'checkbox' || tag == 'radio') && el.checked) { // the element is checked! 
       echo += '<strong>' + el.name + '</strong>: ' + el.value + '<br />'; 
      } 
     } 
    } 
    document.getElementById('lblValues').innerHTML = echo; 
}