> 웹 프론트엔드 > JS 튜토리얼 > JavaScript와 jQuery를 사용하여 양식 데이터를 얻는 방법은 무엇입니까?

JavaScript와 jQuery를 사용하여 양식 데이터를 얻는 방법은 무엇입니까?

Susan Sarandon
풀어 주다: 2024-11-12 02:03:02
원래의
277명이 탐색했습니다.

How to Get Form Data Using JavaScript and jQuery?

JavaScript/jQuery로 양식 데이터 가져오기

양식 작업을 할 때 포함된 데이터를 프로그래밍 방식으로 검색해야 하는 경우가 종종 있습니다. 이 데이터는 추가 처리, 유효성 검사 또는 서버로 전송하는 데 사용될 수 있습니다. 다행스럽게도 JavaScript와 jQuery를 사용하면 이 데이터를 얻는 과정이 간단합니다.

jQuery의 serializeArray() 메서드

양식에서 데이터를 얻는 효율적이고 편리한 방법 중 하나 jQuery의 serializeArray() 메소드를 사용하는 것입니다. 이 메서드는 개체의 배열을 반환하며, 여기서 각 개체는 양식의 입력 요소를 나타냅니다. 각 개체에는 요소의 이름과 값 속성이 포함됩니다.

이 방법을 사용하려면 양식 선택기에서 간단히 호출하세요.

var data = $('form').serializeArray();
로그인 후 복사

데이터 배열에는 다음과 같은 개체가 포함됩니다.

[
  {"name":"foo","value":"1"},
  {"name":"bar","value":"xxx"},
  {"name":"this","value":"hi"}
]
로그인 후 복사

jQuery의 직렬화() 방법

또 다른 옵션은 문자열을 반환하는 jQuery의 serialize() 메서드를 사용하는 것입니다. 이 문자열은 기존 HTML 양식 제출에서 허용되는 형식의 양식 데이터를 나타냅니다.

이 방법을 사용하려면 양식 선택기에서 호출하면 됩니다.

var data = $('form').serialize();
로그인 후 복사

데이터 변수에는 다음이 포함됩니다. 다음과 같은 문자열:

"foo=1&bar=xxx&this=hi"
로그인 후 복사

Demo

To 이러한 메서드가 실제로 작동하는 것을 확인하고 다음 바이올린을 확인하세요: https://jsfiddle.net/w84ny75L/

위 내용은 JavaScript와 jQuery를 사용하여 양식 데이터를 얻는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿