기본 js를 사용하여 양식 직렬화 구현(그래픽 튜토리얼)

다음은 관심 있는 학생들을 위해 제가 편집한 양식 직렬화의 기본 js 구현입니다.

먼저 jquery에서 해당 양식 직렬화 방법을 소개합니다:

1.serialize() 방법

Format: var data = $("form").serialize();

함수: 양식을 변환합니다. 내용은 다음과 같습니다. 문자열로 직렬화됩니다.

　이렇게 하면 ajax를 통해 양식 데이터를 제출할 때 모든 매개변수를 하나씩 나열할 필요가 없습니다. 데이터 매개변수를 $("form").serialize()로 설정하면 됩니다.

2.serializeArray() method

Format: var jsonData = $("form").serializeArray();

기능: 페이지 양식을 JSON 구조 개체로 직렬화합니다. JSON 문자열이 아니라는 점에 유의하세요.

　예를 들어 [{"name":"lihui", "age":"20"},{...}]는 jsonData[0].name으로 데이터를 가져옵니다.

이제 원본 js를 사용하여 구현합니다. 양식 직렬화를 위한 함수

먼저 단계를 나열합니다.

1) 먼저 ById 또는 양식을 사용하여 양식을 가져옵니다.

2) 획득한 후 요소를 통해 양식의 모든 요소 배열을 가져옵니다.

3) 그런 다음 순회하여 유형을 결정하고(유형에 따라 해당 객체 접합) 직렬화된 객체를 구현합니다.

코드는 다음과 같습니다. :

function formser(form){
  var form=document.getElementById(form);
  var arr={};
 for (var i = 0; i < form.elements.length; i++) {
  var feled=form.elements[i];
  switch(feled.type) {
 case undefined:
 case &#39;button&#39;:
  case &#39;file&#39;:
  case &#39;reset&#39;:
  case &#39;submit&#39;:
  break;
  case &#39;checkbox&#39;:
  case &#39;radio&#39;:
  if (!feled.checked) {
  break;
  }
  default:
  if (arr[feled.name]) {
  arr[feled.name]=arr[feled.name]+&#39;,&#39;+feled.value;
  }else{
  arr[feled.name]=feled.value;
  }
  }
  }
  return arr
}

위는 양식 직렬화를 구현하기 위해 제가 컴파일한 기본 js입니다. 앞으로 도움이 되길 바랍니다.

관련글 :

JS에서 슬라이딩 퍼즐 인증코드 구현하기

vuejs

Source Node.js에서 v-if와 v-show 사용에 대한 자세한 설명 등록 이메일 활성화 지침 자세한 설명

위 내용은 기본 js를 사용하여 양식 직렬화 구현(그래픽 튜토리얼)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!