>  기사  >  웹 프론트엔드  >  Ajax로 양식 데이터를 제출하는 방법은 무엇입니까? Ajax로 폼 데이터를 제출하는 방법 소개

Ajax로 양식 데이터를 제출하는 방법은 무엇입니까? Ajax로 폼 데이터를 제출하는 방법 소개

不言
不言원래의
2018-10-12 10:57:2122062검색

양식 데이터 제출을 위해 일반적으로 ajax를 사용하여 제출한다고 생각합니다. ajax는 양식 양식 데이터를 어떻게 제출합니까? 다음 글에서는 ajax 양식 데이터 제출 방법을 소개합니다. 필요한 파트너는 이를 참고할 수 있습니다.

더 이상 고민하지 말고 바로 본문으로 들어가겠습니다~

Ajax 양식 데이터 제출은 두 가지 유형으로 나눌 수 있습니다. 하나는 반환 결과가 없는 것입니다. 즉, 양식 데이터가 백그라운드에 제출되고 백그라운드 처리는 Completed; 첫 번째는 결과를 반환하는 것이며 백그라운드 실행의 성공 또는 실패에 대한 정보를 전경으로 반환해야 합니다.

ajax 자체는 결과를 반환하는 카테고리에 속하며 성공 방법은 백그라운드 반환 결과를 처리하는 것입니다.

Ajax는 양식 양식 데이터를 제출하고 결과를 반환합니다. 구현 방법: 양식 양식 데이터 직렬화

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>login test</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="ajax方式">
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script type="text/javascript">
        function login() {
            $.ajax({            //几个参数需要注意一下
                type: "POST",//方法类型
                dataType: "json",//预期服务器返回的数据类型
                url: "/users/login" ,//url
                data: $(&#39;#form1&#39;).serialize(),                
                success: function (result) {                    
                console.log(result);//打印服务端返回的数据(调试用)
                    if (result.resultCode == 200) {
                        alert("SUCCESS");
                    }
                    ;
                },                
                error : function() {
                    alert("异常!");
                }
            });
        }    </script></head><body><div id="form-div">
    <form id="form1" onsubmit="return false" action="##" method="post">
        <p>用户名:<input name="userName" type="text" id="txtUserName" tabindex="1" size="15" value=""/></p>
        <p>密 码:<input name="password" type="password" id="TextBox2" tabindex="2" size="16" value=""/></p>
        <p><input type="button" value="登录" onclick="login()"> <input type="reset" value="重置"></p>
    </form></div></body></html>

참고: 이런 방식으로 양식 양식 데이터를 제출할 때 양식 양식의 항목에는 이름 속성이 있어야 한다는 점에 유의해야 합니다. 및 배경 획득된 키-값 쌍은 키=이름 값, 값=각 값입니다. 입력 태그, 범위 또는 기타 태그인지 여부에 관계없이 이름 속성이 없으면 항목이 될 수 없습니다. 백그라운드에서 얻었습니다. ,

위 내용은 이 글의 전체 내용입니다. 더 흥미로운 내용은 PHP 중국어 사이트의 다른 칼럼을 참고하시면 됩니다! ! !


위 내용은 Ajax로 양식 데이터를 제출하는 방법은 무엇입니까? Ajax로 폼 데이터를 제출하는 방법 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.