display : none에 의해 숨겨진 입력 필드를 서버로 보내는 것을 피하는 방법은 무엇입니까?

여러 필드의 가시성을 전환하는 양식이 있다고 가정하십시오. 필드가 표시되지 않는 경우 해당 값이 요청되는 것을 원하지 않습니다.

이 상황을 어떻게 처리합니까?

양식 요소를 비활성화로 설정하면 서버로의 이동이 중지됩니다. 예 :

<input disabled="disabled" type="text" name="test"/>

자바 스크립트에서는 다음과 같은 의미입니다.

var inputs = document.getElementsByTagName('input');
for(var i = 0;i < inputs.length; i++) {
    if(inputs[i].style.display == 'none') {
        inputs[i].disabled = true;
    }
}
document.forms[0].submit();

jQuery에서 :

   $('form > input:hidden').attr("disabled",true);
   $('form').submit();

javascript를 사용하여 disabled 속성을 설정할 수 있습니다. '제출'버튼 클릭 이벤트가이 작업을 수행하는 가장 좋은 장소 일 것입니다.

그러나 나는 이것을 전혀하지 않는 것이 좋다. 가능하면 서버에서 쿼리를 필터링해야합니다. 이것은 더 신뢰할 수 있습니다.

숨겨진 상위 요소 내의 모든 요소 또는 특정 요소를 비활성화하려면 다음을 사용할 수 있습니다.

$("div").filter(":hidden").children("input[type='text']").attr("disabled", "disabled");

이 예는 http://jsfiddle.net/gKsTS/ 숨겨진 div 내의 모든 텍스트 상자를 비활성화합니다.

는 어때:

$('#divID').children(":input").prop("disabled", true); // disable

과

$('#divID').children(":input").prop("disabled", false); // enable

숨겨진 div 내에서 모든 하위 입력 (선택, 체크 박스, 입력, 텍스트 영역 등)을 토글합니다.

매우 간단한 (항상 가장 편리한 것은 아님) 솔루션 중 하나는 "이름"속성을 제거하는 것입니다. 표준에서는 브라우저가 이름이 지정되지 않은 값을 보내지 않아야하며 내가 아는 모든 브라우저가이 규칙을 준수해야합니다.

입력에서 값을 제거하거나 DOM에서 입력 개체를 분리하여 처음에 게시되지 않도록합니다.